Pie Charts



Visualize your data in 6 different ways. Each of them animated, with a load of customisation options and interactivity extensions. Chart.js uses the HTML5 canvas element. It’s supported in all modern browsers.

Bread10%
Butter5%
Milk15%
Oil30%
Salt27%
Water3%


Dougnut Charts


Bread10%
Butter5%
Milk15%
Oil30%
Salt27%
Water3%

Pie and doughnut charts are probably the most commonly used chart there are. They are divided into segments, the arc of each segment shows a the proportional value of each piece of data. They are excellent at showing the relational proportions between data.


Polar Area Charts


Polar area charts are similar to pie charts, but each segment has the same angle – the radius of the segment differs depending on the value. This type of chart is often useful when we want to show a comparison data similar to a pie chart, but also show a scale of values for context.

Bread10%
Butter5%
Milk15%
Oil30%
Salt27%
Water3%


Bar Charts


Bread
Butter

A bar chart is a way of showing data as bars. It is sometimes used to show trend data, and the comparison of multiple data sets side by side.


Line Charts


A line chart is a way of plotting data points on a line. Often, it is used to show trend data, and the comparison of two data sets.

Bread
Butter


Radar Charts


Bread
Butter

A radar chart is a way of showing multiple data points and the variation between them. They are often useful for comparing the points of two or more different data sets.