Chart JS

Developer features allow extending and enhancing Chart.js in many different ways.

1. Required Vendor files
                    
                        <script src="chart.min.js"></script>
                    
                
2. Binding to existing DOM element
                    
                        <div id="chart-chartjs"></div>
                    
                
3. Basic usage may look something like this
          
              // Initialization
              var ctx = $("#chart-chartjs");

              // Chart options
              var chartOptions = {
                  ....................
              };
              // Chart Data
              var chartData = {
                  ....................
              };
              // Configuration
              var config = {
                  type: 'line',
                  // Chart Options
                  options : chartOptions,
                  data : chartData
              };
              // Create the chart
              var lineChart = new Chart(ctx, config);

          
      

Refer more chart configuration options from here

Refer following links for detailed documentation, configuration options, methods and examples:

Type URL
Plugin Link https://www.chartjs.org/
Github Page https://github.com/chartjs/Chart.js
Template Page https://pixinvent.com/demo/frest-clean-bootstrap-admin-dashboard-template/html/ltr/vertical-menu-template/chart-chartjs.html