Echarts怎么重新渲染

这篇文章主要介绍“Echarts怎么重新渲染”的相关知识，小编通过实际案例向大家展示操作过程，操作方法简单快捷，实用性强，希望这篇“Echarts怎么重新渲染”文章能帮助大家解决问题。

当我点击饼图时，出现相应的内容，并重新渲染饼图展示内容 饼图点击事件

this.conechart.on('click', (params) => {    params.name});

获取的是点击的对应的板块名 利用获取的板块名，去接口调取对应的数据 ， 调取数据是异步调用 ，所以重新渲染视图要在 异步中渲染，否则同步渲染不出数据

var options = this.conechart.getOption()options.series[0].data = res.datathis.conechart.setOption(options)

getoption()是获取当前视图配置项 进行重新赋值 setoption()是挂载配置项 完整代码

initconechart () {  this.conechart = this.$echarts.init(document.getElementById('conechart'));  const option = {    title: {      text: '风险占比',      // subtext: 'Fake Data',      left: '45%',      top: "20px",      textStyle:{        fontSize:30,      }    },    tooltip: {      trigger: 'item'    },    legend: {      type: 'scroll',      orient: 'vertical',      left: 'left',      top:5,    },    series: [      {        name: 'Access From',        type: 'pie',        radius: '50%',        left:"10%",        top:"15%",        data: this.piedata,        emphasis: {          itemStyle: {            shadowBlur: 10,            shadowOffsetX: 0,            shadowColor: 'rgba(0, 0, 0, 0.5)'          }        },        label: {          alignTo: "labelLine",          distanceToLabelLine: 10,          edgeDistance: "15%"        },        labelLayout: {          fontSize: "16"        }      }    ]  };  this.conechart.setOption(option)  this.conechart.on('click', (params) => {    if ( this.isshow == 0) {      this.getWarnInfoBySecond(params.name)    }  });},

if判断是一个开关，控制只能点击一次

//  更新视图getWarnInfoBySecond(name) {  getWarnInfoBySecond(name).then(res => {    var options = this.conechart.getOption()    options.series[0].data = res.data    this.conechart.setOption(options)    this.isshow = 1  })},

关于“Echarts怎么重新渲染”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识，可以关注编程网精选频道，小编每天都会为大家更新不同的知识点。