Creating a Basic Stock Chart

Creating a basic financial stock chart using ApexStock.js

To create a basic stock chart with minimal configuration, write as follows:

<div id="chart"></div>

const chartOptions = {
  chart: {
    height: 400,
  },
  series: [
    {
      data: [
        {
          x: "2024-01-01",
          y: [100, 101.05, 96.53, 98],
          v: 363305,
        },
        {
          x: "2024-01-02",
          y: [98, 98.39, 95.55, 97.51],
          v: 612318,
        },
        {
          x: "2024-01-03",
          y: [97.51, 98.14, 97.29, 97.63],
          v: 915487,
        },
      ],
    },
  ],
};

// Create and render the ApexStock chart
const stockChart = new ApexStock(
  document.querySelector("#chart"),
  chartOptions
);

stockChart.render();