我正在研究Highchart馅饼。当我单击一个切片时,我想进行向下钻取并更新我的图表标题。
我的钻取工作正常。
我的标题更新方法也是如此。
但是,当我尝试在同一单击上进行更新和下钻时,它不起作用,因为在我可以捕获点击的点值之前,似乎发生了下钻。
Here is a JSFiddle to illustrate my point.
这是我的js代码:
$(function () {
status_ = [['Ouverts', 896],['En cours',8],['Résolus - Clôs',0],['Ouverts', 3],['En cours',65],['Résolus - Clôs',0],['Ouverts', 427],['En cours',193],['Résolus - Clôs',0],['Ouverts', 48],['En cours',41],['Résolus - Clôs',0],['Ouverts', 2],['En cours',0],['Résolus - Clôs',0],['Ouverts', 38],['En cours',42],['Résolus - Clôs',0],['Ouverts', 244],['En cours',123],['Résolus - Clôs',0],['Ouverts', 5],['En cours',222],['Résolus - Clôs',0],['Ouverts', 441],['En cours',0],['Résolus - Clôs',0],['Ouverts', 259],['En cours',2],['Résolus - Clôs',0],['Ouverts', 16],['En cours',2],['Résolus - Clôs',0],['Ouverts', 6],['En cours',0],['Résolus - Clôs',0]];
var browserData = [];
var drillDownSerie = [];
for (var i = 0; i <18 ; i++) {
// add browser data
browserData.push({
name: i,
y: i
//if you uncomment here the drilldown works but not the title update
//,drilldown: i
});
drillDownSerie.push({
id: i,
data: [status_[3 * i],
status_[3 * i + 1],
status_[3 * i + 2]
]
});
}
$('#summary').highcharts({
chart: {
type: 'pie'
},
title: {
text: 'Répartition des 3000 derniers tickets'
},
plotOptions: {
series: {
dataLabels: {
enabled: true,
format: '{point.name}: {point.y}'
},
point:{
events:{
click: function(){
UpdateTitle(this.y);
}
}
}
}
},
tooltip: {
headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y}</b> of total<br/>'
},
credits : {enabled : false},
series: [{
name: 'Département',
colorByPoint: true,
data: browserData
}],
drilldown: {
series: drillDownSerie
}
});
var chart = $('#summary').highcharts();
function UpdateTitle(argument1) {
chart.setTitle({
text: argument1
})
}
})
最佳答案