echarts点击饼图触发事件怎么实现
时间: 2023-11-28 10:03:37 浏览: 211
可以通过 echarts 的事件监听来实现点击饼图触发事件。具体实现步骤如下:
1. 在 echarts 的 option 中设置饼图的 series,同时设置 series 中的 label 为可点击状态。
2. 在 echarts 的实例对象中使用 on 方法监听饼图的点击事件,当点击事件触发时,可以获取到当前点击的数据信息。
下面是一个简单的示例代码:
```javascript
// echarts 实例对象
var myChart = echarts.init(document.getElementById('main'));
// 饼图的 option 配置
var option = {
series: [{
type: 'pie',
data: [
{value: 335, name: '直接访问'},
{value: 310, name: '邮件营销'},
{value: 234, name: '联盟广告'},
{value: 135, name: '视频广告'},
{value: 1548, name: '搜索引擎'}
],
label: {
show: true,
formatter: '{b} : {c} ({d}%)',
fontSize: 14
}
}]
};
// 设置 option
myChart.setOption(option);
// 监听饼图的点击事件
myChart.on('click', function(params) {
console.log(params); // 输出当前点击的数据信息
});
```
阅读全文