Animated Circular Value Indicator With jQuery and Raphael – jQuery Bend Gauge

Bend Gauge is a jQuery plugin worked with Raphael.js that allows you to  create nice-looking animated value representations.

Demo

Download

Basic Usage:

Embed necessary javascript files on the web page.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js" type="text/javascript"></script>
<script src="jquery.bend-gauge.js" type="text/javascript"></script>

Create a container for the circular value indicator.

<div id="indicator"></div>

Fire the function and done

$('#indicator').bendGauge();