echarts仪表盘option_使用echart仪表盘

html代码

温度仪表盘

window.οnlοad=function(){

var myChart = echarts.init(document.getElementById('temperature'));

option = {

tooltip : {

formatter: "{a}
{b} : {c}℃"

},

series: [

{

name: '温度',

type: 'gauge',

min:50,//最小值

max:60,//最大值

splitNumber:20, //刻度的个数

radius:"100%",//大小

pointer:{ //指针

width:3,

length:'90%',

},

axisLabel:{ //刻度的大小

textStyle:{

fontSize:7,

},

},

axisLine:{ //外轮廓的宽度

lineStyle:{

width:15,

}

},

splitLine:{ //刻度线的长度和宽度

length:15,

lineStyle:{

width:1,

}

},

detail: {

formatter:'{value}℃',

textStyle:{ //当前温度的文字大小

fontSize:12

},

},

data: [{

value: 50,

name: '温度',

}]

}

]

};

setInterval(function () {

option.series[0].data[0].value = randomFrom(50,60);

myChart.setOption(option, true);

},2000);

}

function randomFrom(lowerValue,upperValue)

{

return (Math.random() * (upperValue - lowerValue + 1)+ lowerValue).toFixed(1);

}

View Code

标签：function,echart,50,value,width,lowerValue,使用,仪表盘,option

来源： https://www.cnblogs.com/xifengmo/p/11315812.html