定时刷新echart,让echart重新渲染

编程入门 行业动态 更新时间:2024-10-21 06:11:06

定时刷新<a href=https://www.elefans.com/category/jswz/34/1758373.html style=echart,让echart重新渲染"/>

定时刷新echart,让echart重新渲染

echarts图表显示代码

function initChart2() {var option; // 定时刷新需要let newPromise = new Promise((resolve) => {resolve()})//然后异步执行echarts的初始化函数newPromise.then(() => {//	此dom为echarts图标展示domlet chart = myEcharts.init(document.getElementById("myEcharts2"), "purple-passion");option = {series: [{type: 'gauge',name: '外层辅助',radius: '74%',startAngle: '225',endAngle: '-45',splitNumber: '120',pointer: {show: false},detail: {show: false,},data: [{value: 1}],// data: [{value: 1, name: 90}],title: {show: false,offsetCenter: [0, 30],textStyle: {color: '#fff',fontStyle: 'normal',fontWeight: 'normal',fontFamily: '微软雅黑',fontSize: 20,}},axisLine: {show: true,lineStyle: {color: [[1, '#00FFFF']],width: 2,opacity: 1}},axisTick: {show: false},splitLine: {show: true,length: 20,lineStyle: {color: '#051932',width: 0,type: 'solid',},},axisLabel: {show: false}},{type: 'gauge',radius: '70%',startAngle: '225',endAngle: '-45',pointer: {show: true},detail: {formatter: function (value) {var num = Math.round(value);return dataArr[0].value + '%';},rich: rich,offsetCenter: [0, '60%'], // x, y,单位pxtextStyle: {color: '#fff',fontSize: 18}},data: dataArr,title: {show: false,},axisLine: {show: true,lineStyle: {color: colorSet,width: 10,shadowOffsetX: 0,shadowOffsetY: 0,opacity: 1}},axisTick: {show: false},splitLine: {show: false,length: 25,lineStyle: {color: '#00377a',width: 2,type: 'solid',},},axisLabel: {show: false},animationDuration: 4000,},{name: '灰色内圈', //刻度背景type: 'gauge',z: 2,radius: '60%',startAngle: '225',endAngle: '-45',//center: ["50%", "75%"], //整体的位置设置axisLine: { // 坐标轴线lineStyle: { // 属性lineStyle控制线条样式color: [[1, '#018DFF']],fontSize: 20,width: 2,opacity: 1, //刻度背景宽度}},splitLine: {show: false},axisLabel: {show: false},pointer: {show: false},axisTick: {show: true},detail: {show: 0}},{ //内圆type: 'pie',radius: '30%',center: ['50%', '50%'],z: 1,itemStyle: {normal: {color: new echarts.graphic.RadialGradient(.5, .5, .8, [{offset: 0,color: '#4978EC'},{offset: .5,color: '#1E2B57'},{offset: 1,color: '#141F3D'}], false),label: {show: false},labelLine: {show: false}},},hoverAnimation: false,label: {show: false,},tooltip: {show: false},data: [100],animationType: "scale"},]};chart.clear();// 定时刷新需要option && chart.setOption(option);// 定时刷新需要})
}

echarts定时调用代码

function getSpider(){initChart2();
}window.setInterval(getSpider, 5000);// 每5s请求一次

更多推荐

定时刷新echart,让echart重新渲染

本文发布于:2023-12-03 18:18:41,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1656912.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:echart

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!