Apex Charts

ApexCharts is loaded with powerful features to fulfill your data-visualization needs. In addition to providing a pleasing appearances to your charts, ApexCharts gives high performance too. ApexCharts scales gracefully in desktops, tablets as well as mobiles. You can set responsive queries and can have different layouts for different screen sizes.

Note ! Apex Chart's download options in toolbar does not support in IE.

1. Initialize the plugin by referencing the necessary files:

                    
                         <script src="apexcharts.min.js"></script>
                        <link rel="stylesheet" type="text/css" href="apexcharts.css">

2. HTML Markup.

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

3. Basic usage may look something like this.

                    
                        // Chart options
                        var option = {
                            ....................
                        };
                        // Initialization
                        var chart = new ApexCharts(
                            document.querySelector("#chart-apex"),
                            options
                        );
                        chart.render();

Refer more chart configuration options from here

Refer following links for detailed documentation, methods and examples:

Type	URL
Plugin Link	https://apexcharts.com/docs/installation/
Github Page	https://github.com/apexcharts/apexcharts.js
Template Page	https://pixinvent.com/demo/vuexy-html-bootstrap-admin-template/html/ltr/vertical-menu-template/chart-apex.html