Charts

Charts on this page use Chart.js - Simple yet hsdfdsfhsdfible JavaScript charting for designers & developers.

Bar chart


                    
                      <canvas class="max-w-100" id="BarChart"></canvas>
                    
                  

Bar chart horizontal


                    
                      <canvas class="max-w-100" id="PipelineChart"></canvas>
                    
                  

Bar chart combo


                    
                      <canvas class="max-w-100" id="TrafficChart"></canvas>
                    
                  

Line chart


                    
                      <canvas class="max-w-100" id="SesionLine"></canvas>
                    
                  

Line chart interpolation


                    
                      <canvas class="max-w-100" id="LineChart"></canvas>
                    
                  

Line chart area


                    
                      <canvas class="max-w-100" id="LineArea"></canvas>
                    
                  

Line chart thin


                    
                      <canvas class="max-w-100" id="UserChart"></canvas>
                    
                  

Plain chart


                    
                      <canvas class="max-w-100" id="LineAreaSm"></canvas>
                      <canvas class="max-w-100" id="BarChartSm"></canvas>
                    
                  

Gauge chart


                    
                      <div class="relative" style="margin-top: -18%;margin-bottom:-18%">
                        <canvas id="GaugeChart" class="max-w-100"></canvas>
                      </div>
                    
                  

Mixed chart


                    
                      <canvas class="max-w-100" id="CrmChart"></canvas>
                    
                  

Doughnut chart


                    
                      <canvas class="max-w-100" id="DeviceChart"></canvas>
                    
                  

Pie chart


                    
                      <canvas class="max-w-100" id="PieChart"></canvas>
                    
                  

All demo chart config is available in src/js/chart/**.js. Please read more documentaion about chart in https://www.chartjs.org/