我在看http://api.highcharts.com/highstock#chart.events。我希望事件处理程序在日期范围发生变化时捕获事件。应为所有日期更改捕获此日期更改。例如,当单击 rangeSelector 中的按钮或使用日期选择器输入日期或由于日期范围的变化而导致图表中的任何其他变化时。我需要 Highcharts.dateFormat('%Y-%m-%d',event.xAxis[0].min) 和 Highcharts.dateFormat('%Y-%m-%d', event.xAxis[0]。 max) 要传递给事件处理程序的值。这是为了显示一个带有已选择的新日期范围的附加图表。问候约瑟夫
问问题
1653 次
4 回答
0
感谢您回答我的问题,我试图将输入发送到我的第二个图表以及同一页面上的 StockChart。我需要 x 轴坐标,如果有任何变化,我将其作为表单元素提供给我的第二个图表StockChart 的日期选择器。我使用以下代码作为我的解决方案。
chart: {
events: {
redraw: function (e) {
fromDateStockChart=Highcharts.dateFormat('%Y-%m-%d',this.xAxis[0].min);
toDateStockChart=Highcharts.dateFormat('%Y-%m-%d',this.xAxis[0].max);
/*console.log('fromDateStockChart='+fromDateStockChart
+' toDateStockChart'+toDateStockChart);*/
form = document.searchFilters;
form.date_from.value = fromDateStockChart;
form.date_to.value = toDateStockChart;
}
}
}
问候约瑟夫
于 2014-12-31T18:05:54.523 回答
0
您可以load
在图表上使用事件,然后为rangeSelector
按钮定义处理程序:
chart : {
events: {
load: function () {
var chart = this;
var buttons = this.rangeSelector.buttons;
buttons[0].on('click', function (e) {
alert(Highcharts.dateFormat('%Y-%m-%d',chart.xAxis[0].min));
alert(Highcharts.dateFormat('%Y-%m-%d',chart.xAxis[0].max));
});
}
}
}
这是第一个按钮rangeSelector
:DEMO
然后,您可以为所有按钮添加处理程序
编辑:
正如Sebastian Bochan所说,您可以使用afterSetExtremes
andsetExtremes
事件,它会检查每个更改图表范围的操作,包括entering a date or dragging the cursor to select a date range
.
但不利的一面是当您使用dragging
导航器时,因为它不会等到您释放鼠标按钮并触发范围内每个点更改的事件。如果您不介意,那么这对您来说将是一个很好的解决方案:DEMO
于 2014-12-29T08:36:46.597 回答
0
你可以赶上setExtremes / afterSetExtremes
于 2014-12-29T10:09:48.630 回答
0
你应该看这个例子http://jsfiddle.net/ag2a5q4w/1/
$('#container').highcharts('StockChart', {
xAxis : {
events: {
afterSetExtremes: function () {
alert(Highcharts.dateFormat('%Y-%m-%d',this.min));
alert(Highcharts.dateFormat('%Y-%m-%d',this.max));
}
}
},
rangeSelector : {
selected : 1
},
title : {
text : 'AAPL Stock Price'
},
series : [{
name : 'AAPL',
data : data,
tooltip: {
valueDecimals: 2
}
}]
})
于 2016-07-12T15:12:34.020 回答