我试图捕捉Sunburst图表上的钻取事件,但我无法实现它 .
我将events对象添加到图表对象中,但仍然无法在函数中触发警报 .
我基本上希望在我们通过在向下钻取水平/水平之后单击右上方的按钮进行钻取时触发警报/ console.log .
这里有codepen供您参考 .
Highcharts.chart('container', {
chart: {
height: '100%',
events: {
drillup: function() {
alert('Drilling up')
}
}
},
title: {
text: 'World population 2017'
},
subtitle: {
text: 'Source <href="https://en.wikipedia.org/wiki/List_of_countries_by_population_(United_Nations)">Wikipedia</a>'
},
series: [{
type: "sunburst",
data: data,
allowDrillToNode: true,
cursor: 'pointer',
dataLabels: {
format: '{point.name}',
filter: {
property: 'innerArcLength',
operator: '>',
value: 16
}
},
levels: [{
level: 1,
levelIsConstant: false,
dataLabels: {
filter: {
property: 'outerArcLength',
operator: '>',
value: 64
}
}
}, {
level: 2,
colorByPoint: true
},
{
level: 3,
colorVariation: {
key: 'brightness',
to: -0.5
}
}, {
level: 4,
colorVariation: {
key: 'brightness',
to: 0.5
}
}]
}],
tooltip: {
headerFormat: "",
pointFormat: 'The population of <b>{point.name}</b> is <b>{point.value}</b>'
}
});
请指教 .
1 回答
您可以为sunburst.prototype.drillUp方法创建一个包装器,并在向上钻取之前或之后添加您的代码 .
包装原型函数文档:
https://www.highcharts.com/docs/extending-highcharts/extending-highcharts
在线演示:
https://jsfiddle.net/wchmiel/gsx1bacu/