Create a bar chart

This is the official documentation of the @forestadmin/agent Node.js agent.

This second example shows how you can achieve any format of charts, as you can benefit from external libraries like D3js.

Agent

agent.addChart('alphabetfrequency', async (context, resultBuilder) => {
  // You may want to load that data dynamically
  // [...]

  return resultBuilder.smart([
    { name: 'E', value: 0.12702 },
    { name: 'T', value: 0.09056 },
    { name: 'A', value: 0.08167 },
    { name: 'O', value: 0.07507 },
    { name: 'I', value: 0.06966 },
    { name: 'N', value: 0.06749 },
    { name: 'S', value: 0.06327 },
    { name: 'H', value: 0.06094 },
    { name: 'R', value: 0.05987 },
    { name: 'D', value: 0.04253 },
    { name: 'L', value: 0.04025 },
    { name: 'C', value: 0.02782 },
    { name: 'U', value: 0.02758 },
    { name: 'M', value: 0.02406 },
    { name: 'W', value: 0.0236 },
    { name: 'F', value: 0.02288 },
    { name: 'G', value: 0.02015 },
    { name: 'Y', value: 0.01974 },
    { name: 'P', value: 0.01929 },
    { name: 'B', value: 0.01492 },
    // [...]
  ]);
);

Component

Template

In the above snippet, notice how we import the D3js library. You can, of course, choose to use any other library of your choice.

This bar chart is inspired by this one.

The resulting chart can be resized to fit your use.