echarts环形 legend点击的时候legend前边icon会变大
时间: 2023-07-17 13:37:05 浏览: 88
ECharts环形图的Legend点击时,前面的图标变大可以通过设置`emphasis`属性来实现。具体来说,可以在`legend`中的`data`项中为每个数据设置`emphasis`属性,然后在`emphasis`属性中设置`iconStyle`的`borderWidth`和`shadowBlur`属性来控制图标的大小。
以下是一个示例代码:
```javascript
option = {
legend: {
data: ['A', 'B', 'C']
},
series: [{
name: '访问来源',
type: 'pie',
radius: ['40%', '60%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center'
},
labelLine: {
show: false
},
data: [
{value: 335, name: 'A'},
{value: 310, name: 'B'},
{value: 234, name: 'C'}
]
}]
};
// 为每个Legend设置emphasis属性
option.legend.data.forEach(function (name) {
option.legend[name] = {
emphasis: {
iconStyle: {
borderWidth: 10,
shadowBlur: 20
}
}
};
});
```
在上述代码中,我们为每个Legend设置了`emphasis`属性,并在`emphasis`属性中为`iconStyle`设置了`borderWidth`和`shadowBlur`属性,来控制图标的大小。当用户点击Legend时,前面的图标就会变大。
阅读全文