Anychart is an easy to use library that lets us add chart into our JavaScript web app.

In this article, we’ll look at how to create basic charts with Anychart.

High-Low (HiLo) Chart

We can create high-low charts easily with Anychart.

To add one, we write:

<script src="https://cdn.anychart.com/releases/8.9.0/js/anychart-base.min.js" type="text/javascript"></script>

<div id="container" style="width: 500px; height: 400px;"></div>

Then we write:

const data = [
  ["January", 1000, 5000],
  ["February", 500, 2000],
  ["March", 3000, 6000],
  ["April", 4000, 19680],
  ["May", 6000, 58581]
];
chart = anychart.hilo();
const series = chart.hilo(data);
chart.title("HiLo Chart");
chart.container("container");
chart.draw();

We add the script tag for the base package.

Then we add the container div for rendering the chart.

data has an array of data.

#javascript #programming #technology #web-development