var option = {
tooltip : {
formatter: "{a} <br/>{b} : {c}%"
},
toolbox: {
show : true,
feature : {
mark : {show: true},
restore : {show: true},
saveAsImage : {show: true}
}
},
series : [
{
name:"",
type:"gauge",
center : ["50%", "50%"], //
radius : [0, "75%"],
startAngle: 140,
endAngle : -140,
min: 0, //
max: 100, //
precision: 0, // 0
splitNumber: 10, // 5
axisLine: { //
show: true, // show
lineStyle: { // lineStyle
color: [[0.2, "lightgreen"],[0.4, "orange"],[0.8, "skyblue"],[1, "-sharpff4500"]],
width: 30
}
},
axisTick: { //
show: true, // show
splitNumber: 5, // split
length :8, // length
lineStyle: { // lineStyle
color: "-sharpeee",
width: 1,
type: "solid"
}
},
axisLabel: { // axis.axisLabel
show: true,
formatter: function(v){
switch (v+""){
case "10": return "";
case "30": return "";
case "60": return "";
case "90": return "";
default: return "";
}
},
textStyle: { // TEXTSTYLE
color: "-sharp333"
}
},
splitLine: { //
show: true, // show
length :30, // length
lineStyle: { // lineStylelineStyle
color: "-sharpeee",
width: 2,
type: "solid"
}
},
pointer : {
length : "80%",
width : 8,
color : "auto"
},
title : {
show : true,
offsetCenter: ["-65%", -10], // x, ypx
textStyle: { // TEXTSTYLE
color: "-sharp333",
fontSize : 15
}
},
detail : {
show : true,
backgroundColor: "rgba(0,0,0,0)",
borderWidth: 0,
borderColor: "-sharpccc",
width: 100,
height: 40,
offsetCenter: ["-60%", 10], // x, ypx
formatter:"{value}%",
textStyle: { // TEXTSTYLE
color: "auto",
fontSize : 30
}
},
data:[{value: 50, name: ""}]
}
]};clearInterval(timeTicket);timeTicket = setInterval(function (){option.series[0].data[0].value = (Math.random()*100).toFixed(2) - 0; myChart.setOption(option, true);},2000)
introduced this code
officially
