echarts环形 legend点击的时候前边icon会变大
时间: 2023-07-12 11:43:34 浏览: 81
Echarts饼图4.0(3D环形图、包含透明效果)
ECharts环形图的Legend点击时,前面的图标变大可以通过设置`emphasis`属性来实现。具体来说,可以在`series`中的`data`项中为每个数据设置`emphasis`属性,然后在`emphasis`属性中设置`itemStyle`的`borderWidth`和`shadowBlur`属性来控制图标的大小。
以下是一个示例代码:
```javascript
option = {
legend: {
data: ['A', 'B', 'C']
},
series: [{
name: '访问来源',
type: 'pie',
radius: ['40%', '60%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '30',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [
{value: 335, name: 'A', emphasis: {
itemStyle: {
borderWidth: 10,
shadowBlur: 20
}
}},
{value: 310, name: 'B', emphasis: {
itemStyle: {
borderWidth: 10,
shadowBlur: 20
}
}},
{value: 234, name: 'C', emphasis: {
itemStyle: {
borderWidth: 10,
shadowBlur: 20
}
}}
]
}]
};
```
在上述代码中,我们为每个数据项设置了`emphasis`属性,并在`emphasis`属性中为`itemStyle`设置了`borderWidth`和`shadowBlur`属性,来控制图标的大小。当用户点击Legend时,前面的图标就会变大。
阅读全文