keyboard_double_arrow_left
help Help & getting started

Chart.js

Simple yet flexible JavaScript charting library for the modern web. Click here

Basic Bar Chart


<canvas id="barChart_1"></canvas>

Gradient Bar Chart


<canvas id="barChart_2"></canvas>

Stalked Bar Chart


<canvas id="barChart_3"></canvas>

Basic Line Chart


<canvas id="lineChart_1"></canvas>

Gradient Line Chart


<canvas id="lineChart_2"></canvas>

Dual Line Chart


<canvas id="lineChart_3"></canvas>

Basic Area Chart


<canvas id="areaChart_1"></canvas>

Gradinet Area Chart


<canvas id="areaChart_2"></canvas>

Dual Area Chart


<canvas id="areaChart_3"></canvas>

Radar Chart


<canvas id="radar_chart"></canvas>

Pie Chart


<canvas id="pie_chart"></canvas>

Doughnut Chart

  • 40% Tickets
  • 35% Events
  • 25% Other

<div class="chart-point">
	<div class="check-point-area">
		<canvas id="doughnut_chart"></canvas>
	</div>
	<ul class="chart-point-list">
		<li><i class="fa fa-circle text-primary me-1"></i> 40% Tickets</li>
		<li><i class="fa fa-circle text-success me-1"></i> 35% Events</li>
		<li><i class="fa fa-circle text-warning me-1"></i> 25% Other</li>
	</ul>
</div>

Polar Chart


<canvas id="polar_chart"></canvas>