如何在Highcharts时间序列中传递第三个值(例如ID号),以便我可以在标记点击的基础上打开一个新窗口? JsFiddle here.
我对simple chart类别的方法很熟悉,但不熟悉时间序列。
通常,Highcharts时间序列会接受一系列数组,例如[1401285311000,1]
,可以在包含event.point.options.x
和event.point.options.y
的点击事件中阅读。
有没有办法为每个点添加id
,然后在点击事件回调中读取它?我已经尝试将其作为第三个值传递(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
});
});
答案 0 :(得分:1)
仅仅因为时间数据并不意味着您无法使用point objects代替数组:
var data = [{
"name": "Value",
"unit": "",
"data": [
{x: 1401285311000, y: 5, id: 1},
{x: 1401288036000, y: 10, id: 2},
{x: 1401289436000, y: 8, id: 3},
{x: 1401291099000, y: 15, id: 4}
]
}, {
"name": "Value 2",
"unit": "",
"data": [
{x: 1401285311000, y: 10, id: 1},
{x: 1401288036000, y: 12, id: 2},
{x: 1401289436000, y: 5, id: 3},
{x: 1401291099000, y: 9, id: 4}
]
}];
更新了fiddle。