问答

Echarts旭日图中的highlightPolicy自定义更改问题

作者:admin 2021-09-08 我要评论

Echarts旭日图中的highlightPolicy一旦默认之后,再用v-model修改highlightPolicy值却无法改变它的效果。在控制器中打印出highlightPolicy,他的值是改变了,但...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

Echarts旭日图中的highlightPolicy一旦默认之后,再用v-model修改highlightPolicy值却无法改变它的效果。在控制器中打印出highlightPolicy,他的值是改变了,但是就是没用
配置代码如下:

var baseoption(
series: {
           type: 'sunburst',
            highlightPolicy: 'descendant',
            emphasis:{
              label:{  //series.label 会覆盖这个
              },
              itemStyle:{
                color:'red',  //鼠标指到高亮颜色
                // highlight:'blue',
              }
            },
            highlight:{
              itemStyle:{
                color:'pink' //子代或父代高亮颜色
              }
            },
            downplay:{
              itemStyle: {
                color: '#ccc'
              }
            },
            // data: this.familydata,
            center:['50%','50%'],  //旭日图中心坐标
            radius: [0, '90%'],    //外半径
            label: {
              rotate: 0,
              align:'center',
              minAngle:1,//小于此度数,label不显示
              show:true,
              position:'inside',
            }
          },
          }
var options=[
            {
              title:{
                // show:true,
                // text:'2000家庭成员'
              },
              series: [
                {
                  highlightPolicy:this.series.highlightPolicy,
                  data:this.familydata01
                }
              ]
            },
            {
              title:{
                // show:true,
                // text:'2020家庭成员'
              },
              series: [
                {
                  highlightPolicy:this.series.highlightPolicy,
                  data:this.familydata02
                }
              ]
            }
          ];
 var option={baseOption, options}
          myChart.setOption(option);
###

经过两天的坚持不懈的寻找,终于找到了渲染失败的原因,在更新echart的option时,要在mychart.setOption(option);的前面加上mychart.clear();把当前echarts示例清空再重新加载,重新渲染

mychart.clear();
mychart.setOption(option);

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • Echarts旭日图中的highlightPolicy自定

    Echarts旭日图中的highlightPolicy自定

  • 怎么在页面挂载前请求接口,并拿到数据

    怎么在页面挂载前请求接口,并拿到数据

  • transform: scale,缩小后,父级的y轴

    transform: scale,缩小后,父级的y轴

  • react-navigation 能不能让页面切换后

    react-navigation 能不能让页面切换后

腾讯云代理商
海外云服务器