如何在Highcharts时间序列中传递第三个值(例如ID号),以便在标记单击时基于该值打开一个新窗口?JsFiddle here.
我熟悉这个方法,它适用于有类别的simple chart,但不适用于时间序列。
通常情况下,Highcharts时间序列接受一系列数组,如[1401285311000,1]
,这些数组可以在带有event.point.options.x
和event.point.options.y
的click事件中读取。
有没有办法给每个点添加一个id
,然后在点的click事件回调中读取它?我试过把它作为第三个值传递(Highcharts完全忽略它),或者把它放在id
下面的两个值([1401285311000, 1, id: {1}]
)之后,这会破坏图表。
有什么想法吗?
// Replacing ajax call with a simple array for simplicity's sake
var data = [{"name":"Value","unit":"","data":[[1401285311000,5, 1],[1401288036000,10, 2],[1401289436000,8, 3],[1401291099000,15, 4]]}, {"name":"Value 2","unit":"","data":[[1401285311000,10, 1],[1401288036000,12, 2],[1401289436000,5, 3],[1401291099000,9, 4]]}]
$(function () {
$('#container').highcharts({
chart: {
zoomType: 'x'
},
title: {
text: 'Time Series'
},
subtitle: {
text: document.ontouchstart === undefined ?
'Click and drag in the plot area to zoom in' :
'Pinch the chart to zoom in'
},
xAxis: {
type: 'datetime',
minRange: 14 * 24 * 3600 // fourteen days
},
yAxis: {
title: {
text: ''
}
},
legend: {
enabled: false
},
plotOptions: {
series: {
lineWidth: 3,
marker: {
fillColor: null,
lineWidth: 2,
lineColor: null, // inherit from series
},
events:{
click: function (event, i) {
console.log(event.point);
}
}
},
line: {
dataLabels:{
enabled: false
}
},
},
series: data
});
});
1条答案
按热度按时间kg7wmglp1#
仅仅因为它是时间数据并不意味着你不能使用点对象来代替数组:
更新了fiddle。