<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Gauge</title>
<script src="~/js/jquery-3.2.1.js"></script>
<script src="~/js/jquery-3.2.1.min.js"></script>
<script src="~/js/echarts.js"></script>
</head>
<body>
<div id="mydiv" style="height:500px;width:800px;">
</div>
</body>
</html>
<script type="text/javascript">
var mychart = echarts.init(document.getElementById('mydiv'));//echarts初始化
var option = {
tooltip: {
formatter: "{a} <br/>{b} : {c}%"
},
toolbox: {
feature: {
restore: {},
saveAsImage: {}
}
},
series: [
{
name: '业务指标',
type: 'gauge',
detail: { formatter: '{value}%' },
data: [{ value: 50, name: '完成率' }]
}
]
};
setInterval(function () {
option.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;//计算数值变化
mychart.setOption(option, true);
}, 2000);
</script>
Echarts之Gauge[仪表盘]
猜你喜欢
转载自blog.csdn.net/qq_31453627/article/details/82625695
今日推荐
周排行