将自定义链接添加到饼图中的系列/数据部分（highcharts.js）

Question

我只是试图允许通过highcharts单击每个数据部分或饼图系列，例如。 商店部分应链接到#shop_section我已经找到了演示，其中在图表中的每个数据部分都设置了全局链接。 但是我只是希望通过单击我的三个数据部分/系列之一来访问唯一的#link 。

   series: [{
        innerSize: '30%',
        data: [
            ['Shop', 10], 
            ['Buy', 10], 
            ['Own', 10], 
        ]
    }]
});

这不起作用：（ 尝试）

    data: [
        {name: 'Shop', 10, url: 'http://my_site1.com'},
        {name: 'Buy', 10,  url: 'http://my_site2.com'},
        {name: 'Own', 10,  url: 'http://my_site3.com'}
    ]

Answer 1

您的系列不正确，应该是：

data: [
    {name: 'Shop', y: 10, url: 'http://my_site1.com'},
    {name: 'Buy', y: 10,  url: 'http://my_site2.com'},
    {name: 'Own', y: 10,  url: 'http://my_site3.com'}
]

Answer 2

使用plotOptions可以完成工作：

    plotOptions: {
        series:{
            point:{
                events:{
                    click: function(){
                        window.location.href = this.url;
                    }
                }
            }
        },
    },

通过简单地使用序列->点->事件，我们可以指定将哪些事件委派给我们的序列点（在饼图的情况下，点是“切片”）。 在事件处理程序函数本身上， this是指单击的点，因此，我可以直接使用您设置的自定义属性url 。