Apex Charts

ApexCharts is an open-source modern charting library that helps developers to create interactive visualizations for web pages.

Step 1

Add Javascript library to body

<script src="assets/vendor/apexchart/apexcharts.min.js"></script>

Step 2

Add Chart area DOM element markup

<div id="chart" class="apexcharts-canvas"></div>

Step 3

var options = {
  chart: {
    type: 'line'
  },
  series: [{
    name: 'sales',
    data: [30,40,35,50,49,60,70,91,125]
  }],
  xaxis: {
    categories: [1991,1992,1993,1994,1995,1996,1997, 1998,1999]
  }
}

var chart = new ApexCharts(document.querySelector("#chart"), options);

chart.render();

To trigger resize charts use following JS Snippet

window.dispatchEvent(new Event('resize'));