Analog Gauge Object

This is a round configurable gauge object with a dial face. The dial transitions smoothly during value changes, using D3 version 4. Also includes digital value, green zone, red zone, and orange zone on the dial face.

Place a <g> element in your svg drawing with its id=name+"GaugeContainer" and translation request. Note: the translation values reference the center of the gauge.
e.g. <g id="myNameGaugeContainer" transform="translate(200,200)" />

Configuring The Gauge:
createGauge(name, label, min, max, majorTicks, minorTicks, ringColor, faceColor, diameter, orangeZoneRange, redZoneRange, greenZoneRange,units)
1.) name - id name for the gauge. Included in id
2.) label - shown in gauge.
3.) min - minimum value on gauge
4.) max - maximum value on gauge
5.) majorTicks - number of tick marks for full range
6.) minorTicks - number of tick marks between each major tick mark
7.) ringColor - outermost circle color
8.) faceColor - gauge circle color.
9.) diameter - The size of the gauge
10.) orangeZoneRange(optional) - orange band [start,end]
11.) redZoneRange(optional) - red band [start,end]
12.) greenZoneRange(optional) - green band [start,end]
13.) units - units of measurement (If unicode character, use hexidecimal number \u[hex]. e.g. for degree symbol: \u00B0)

SVG Source:
Javascript: