I am planning on making an analytics dashboard and would like to implement circular charts like the image attached to this question:

and I would like to do it using jQuery. Do you guys have any usefull links to resources or to other SO questions? Would be awesome!

Thanks!

I am planning on making an analytics dashboard and would like to implement circular charts like the image attached to this question:

and I would like to do it using jQuery. Do you guys have any usefull links to resources or to other SO questions? Would be awesome!

Thanks!

• javascript
• jquery
• charts

3 Answers 3

You can also take a look at :

http://bernii.github./gauge.js/

http://www.justgage./

Both of them look really good and seems pretty easy to use.

The easiest way would probably be to create an SVG that mimics the appearance you want, and then use JavaScript/jQuery to modify the source of the SVG. The design you're requesting could probably be acheived by simply placing two arcs on top of one another.

Deriving from this excellent answer on calculating arcs, creating two overlapping ones could look something like this, which also demonstrates updating the arc dynamically.

lethargicpanda's suggestions are cool. Check out jQuery Knob too. It also allows user input.