All the guages are styled via CSS. See gauge-test.css for styling for each of these gauges below.
<!-- Unstyled gauge (All defaults) --> <div id="gauge0" class="gauge-container"></div>
var gauge0 = Gauge(document.getElementById("gauge0"));
<div id="gauge1" class="gauge-container"></div>
var gauge1 = Gauge( document.getElementById("gauge1"), { max: 100, dialStartAngle: -90, dialEndAngle: -90.001, value: 100, label: function(value) { return Math.round(value) + "/" + this.max; } } );
<div id="gauge2" class="gauge-container two"></div>
var gauge2 = Gauge( document.getElementById("gauge2"), { max: 100, dialStartAngle: 180, dialEndAngle: 0, value: 50 } );
<div id="gauge3" class="gauge-container three"></div>
var gauge3 = Gauge( document.getElementById("gauge3"), { max: 100, value: 50 } );
<div id="gauge4" class="gauge-container four"></div>
var gauge4 = Gauge( document.getElementById("gauge4"), { max: 100, dialStartAngle: 180, dialEndAngle: -90, value: 50 } );
<div id="gauge5" class="gauge-container five"></div>
var gauge5 = Gauge( document.getElementById("gauge5"), { max: 200, dialStartAngle: 0, dialEndAngle: -180, value: 50 } );
<div id="gauge6" class="gauge-container six"></div>
var gauge6 = Gauge( document.getElementById("gauge6"), { max: 100, dialStartAngle: 90.01, dialEndAngle: 89.99, radius: 150, displayValue: false, value: 50, } );