Versatile Interactive SVG Chart Library – apexcharts.js

Category: Chart & Graph , Javascript , Recommended | August 11, 2018
Author: apexcharts
Views Total: 785
Official Page: Go to website
Last Update: August 11, 2018
License: MIT


Versatile Interactive SVG Chart Library – apexcharts.js


apexcharts.js is a feature-rich JavaScript chart library lets you create dynamic, interactive, responsive, animated, SVG-based LINE, AREA, COLUMN/BAR, MIXED, BUBBLE, SCATTER, PIE, RADIALBAR, HEATMAP, GAUGE charts and graphs to visualize your complex data.

Basic usage:

Install it with NPM.

$ npm install apexcharts --save
import ApexCharts from 'apexcharts'

Or include the compiled and minified version of the ‘apexcharts.js’ library on the page.

<script src="/path/to/apexcharts.min.js"></script>

Create a placeholder element for the chart.

<div id="myChart"></div>

Define your own data & options.

var options = {
    chart: {
        height: 380,
        type: 'line',
        zoom: {
            enabled: false
    dataLabels: {
        enabled: false
    stroke: {
        curve: 'straight'
    series: [{
        name: "Desktops",
        data: [30, 41, 35, 51, 49, 62, 69, 91, 126]
    title: {
        text: 'Product Trends by Month',
        align: 'left'
    grid: {
        row: {
            colors: ['#f3f3f3', 'transparent'], // takes an array which will be repeated on columns
            opacity: 0.5
    labels: series.monthDataSeries1.dates,
    xaxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep'],

Create a new ApexCharts chart.

var myChart = new ApexCharts(

Render a basic line chart in the placeholder element.


Check out the Offical Documentation for more usages.



  • bug fixed for dateFormat crashing firefox


  • tooltip formatter fixed for float values. gradient stops corrected


  • v1.2.0: fixed bug when changing color


  • v1.1.5: zoomout fixes


  • v1.1.3: small values handling – yaxis formatters fixed; case sensitivity for filename – turned on; pie label formatter fixed

You Might Be Interested In:

Leave a Reply