97 lines
2.9 KiB
JavaScript
97 lines
2.9 KiB
JavaScript
// Guage Default
|
|
defaultGauge = new Gauge(document.getElementById("gauge-default"));
|
|
defaultGauge.setTextField(document.getElementById("default-textfield"));
|
|
defaultGauge.maxValue = 3000;
|
|
defaultGauge.set(1222);
|
|
|
|
// Gauge Donut
|
|
donutGauge = new Donut(document.getElementById("gauge-donut"));
|
|
donutGauge.setTextField(document.getElementById("donut-textfield"));
|
|
donutGauge.maxValue = 3000;
|
|
donutGauge.set(1333);
|
|
|
|
// Zones
|
|
zoneGauge = new Gauge(document.getElementById("gauge-zone"));
|
|
var opts = {
|
|
angle: -0.25,
|
|
lineWidth: 0.2,
|
|
radiusScale:0.9,
|
|
pointer: {
|
|
length: 0.6,
|
|
strokeWidth: 0.03,
|
|
color: '#000000'
|
|
},
|
|
staticLabels: {
|
|
font: "10px sans-serif",
|
|
labels: [200, 500, 2100, 2800],
|
|
fractionDigits: 0
|
|
},
|
|
staticZones: [
|
|
{strokeStyle: "#F03E3E", min: 0, max: 200},
|
|
{strokeStyle: "#FFDD00", min: 200, max: 500},
|
|
{strokeStyle: "#30B32D", min: 500, max: 2100},
|
|
{strokeStyle: "#FFDD00", min: 2100, max: 2800},
|
|
{strokeStyle: "#F03E3E", min: 2800, max: 3000}
|
|
],
|
|
limitMax: false,
|
|
limitMin: false,
|
|
highDpiSupport: true
|
|
}
|
|
zoneGauge.setOptions(opts);
|
|
zoneGauge.setTextField(document.getElementById("zone-textfield"));
|
|
zoneGauge.minValue = 0;
|
|
zoneGauge.maxValue = 3000;
|
|
zoneGauge.set(1444);
|
|
|
|
//
|
|
stepGauge = new Gauge(document.getElementById("gauge-step"));
|
|
var bigFont = "14px sans-serif";
|
|
var opts = {
|
|
angle: 0.1,
|
|
radiusScale:0.8,
|
|
lineWidth: 0.2,
|
|
pointer: {
|
|
length: 0.6,
|
|
strokeWidth: 0.03,
|
|
color: '#000000'
|
|
},
|
|
staticLabels: {
|
|
font: "10px sans-serif",
|
|
labels: [{label:200, font: bigFont},
|
|
{label:750},
|
|
{label:1500},
|
|
{label:2250},
|
|
{label:3000},
|
|
{label:3500, font: bigFont}],
|
|
fractionDigits: 0
|
|
},
|
|
staticZones: [
|
|
{strokeStyle: "rgb(255,0,0)", min: 0, max: 500, height: 1.2},
|
|
{strokeStyle: "rgb(200,100,0)", min: 500, max: 1000, height: 1.1},
|
|
{strokeStyle: "rgb(150,150,0)", min: 1000, max: 1500, height: 1},
|
|
{strokeStyle: "rgb(100,200,0)", min: 1500, max: 2000, height: 0.9},
|
|
{strokeStyle: "rgb(0,255,0)", min: 2000, max: 3100, height: 0.8},
|
|
{strokeStyle: "rgb(80,255,80)", min: 3100, max: 3500, height: 0.7},
|
|
{strokeStyle: "rgb(130,130,130)", min: 2470, max: 2530, height: 1}
|
|
],
|
|
limitMax: false,
|
|
limitMin: false,
|
|
highDpiSupport: true,
|
|
renderTicks: {
|
|
divisions: 5,
|
|
divWidth: 1.1,
|
|
divLength: 0.7,
|
|
divColor: '#333333',
|
|
subDivisions: 3,
|
|
subLength: 0.5,
|
|
subWidth: 0.6,
|
|
subColor: '#666666'
|
|
}
|
|
};
|
|
stepGauge.setOptions(opts);
|
|
//document.getElementById("preview-textfield").className = "preview-textfield";
|
|
stepGauge.setTextField(document.getElementById("step-textfield"));
|
|
stepGauge.minValue = 0;
|
|
stepGauge.maxValue = 3500;
|
|
stepGauge.set(2222);
|