echart 页面跳转_Echarts饼状图中使用点击事件来跳转到新的链接

业务场景：工作由于需要进行数据的展示，因此需要使用Echarts的饼状图来展示各个部分所占的比重，当然这个都是最基本的功能，然而今天遇到了一个新的需求，饼状图的各个部分需要能点击，而且点击之后需要跳转到对应的数据上，从而就有了今天的这篇文章，废话不多说，先上图：

饼状图

点击之后跳转的页面

下面我来详细介绍一个实现步骤：

将饼状图画好，这里我们默认大家已经画好了，不会的可以在Echarts的官方网站进行查看如何实现。

在给画饼状图的对象绑定一个点击事件，代码如下：

NumberChat.on('click', function(param) {

var url = param.data.url;

// console.log(param);

window.location.href = url;

});

我们这里使用的是on来绑定一个事件，当然这是EchartsApI明确指定的，然后我们可以打印一下param这个形参，截图如下：

打印形参数据

给data增加一个url：可以看到这里面有一个data，我们实际上需要的就是它了，而且这个data就是我们画饼状图时填充的数据(如下图)，因此我们可以给它多加几个参数，其中valu