10 Best Pie/Donut Chart Plugins In JavaScript (2023 Update)

by jQueryScript,

Are you looking for the best JavaScript Chart libraries to present your data in a circle with proportional segments showing proportions and percentages between categories? You’ve come to the right place because I’ll be sharing some of the best Pie Chart libraries that are pretty snazzy.

Check out this list of the 10 best JavaScript/jQuery/Pure CSS chart libraries and see what works best for you. These JavaScript libraries can help you display information from a range of values, percentages and more via creating interactive pie, donut and ring charts.

Feel free to download use them in your next project to plotand visualize your data in a pie- or donut-style circular statistical graphic. Have fun!

Originally Published Oct 2019, updated Feb 20 2023

Table of contents:

jQuery Pie/Donut Chart Plugins:

jQuery Plugin for Converting Content into Canvas Element - peity

A simple jQuery plugin for converting an element's content into a simple canvas element. You can use this plugin to easily create mini pie, line or bar chart on your web page.

jQuery Plugin for Converting Content into Canvas Element - peity

[Demo] [Download]


Customizable Pie Chart/Round Progress Bar Plugin - easy-pie-chart

easy-pie-chart is a lightweight JavaScript/jQuery plugin to draw animated, customizable, retina-ready pie/ring charts and circular progress bars using HTML5 Canvas and requestAnimationFrame API.

Customizable Pie Chart/Round Progress Bar Plugin - easy-pie-chart

[Demo] [Download]


Animated Donut/Pie/Ring Charts With jQuery And SVG - Donutty

Donutty is a JavaScript/jQuery charting library which lets you generate smoothly animated, fully scalable Donut/Pie/Ring Charts or Circular/Radial progressbars using SVG and CSS3 animations.

Animated Donut/Pie/Ring Charts With jQuery And SVG - Donutty

[Demo] [Download]


Simple jQuery Plugin To Draw A SVG Pie Chart - Piechart

a super tiny jQuery plugin used to create a SVG pie chart with a hover animation and percentage display.

Simple jQuery Plugin To Draw A SVG Pie Chart - Piechart

[Demo] [Download]


Elegant SVG Pie & Donut Chart Plugin - listtopie.js

listtopie.js is a jQuery pie chart plugin that makes uses of snap.svg to render an elegant, customizable, animated, nice-looking pie & donut charts for your statistic data.

Elegant SVG Pie & Donut Chart Plugin - listtopie.js

[Demo] [Download]


Vanilla JavaScript Pie/Donut Chart Plugins:

Displaying Progress Pie Chart In Your Favicon – Piecon

A simple jQuery plugin for converting an element's content into a simple canvas element. You can use this plugin to easily create mini pie, line or bar chart on your web page.

Displaying Progress Pie Chart In Your Favicon – Piecon

[Demo] [Download]


cake-chart

Interactive multi-layer pie chart.

cake-chart

[Demo] [Download]


draggable-piechart

A javascript class for interactive draggable pie charts on HTML5 canvas.

draggable-piechart

[Demo] [Download]


Pure CSS Pie/Donut Chart Plugins:

CSS Progress Pie

A pure CSS progress pie chart.

CSS Progress Pie

[Demo] [Download]


CSS Only Donut Chart With Custom Slices

A minimal clean donut chart to represent percentage values as slices using pure CSS/SCSS.

CSS Only Donut Chart With Custom Slices

[Demo] [Download]


Conclusion:

In the past decade, visualizations have become more important than ever before. The pie chart remains popular because it allows you to compare different values without requiring any further interpretation.

It's great for visualizing one data set with associated percentages for each dimension of a two-dimensional graphic.

In this list above we have compiled a list of 10 best Pie, Donut and Ring Chart JavaScript libraries that you can use to make your charts more interactive, beautiful and appealing.

Looking for more jQuery plugins or JavaScript libraries to create awesome Pie/Donut/Ring Charts on the web & mobile? See jQuery Chart & Graph and JavaScript Chart sections for more details.

See Also: