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);