我有一个允许放大/缩小的图表。每次用户放大/缩小时,都会出现“重置缩放”。
现在我添加了一个新的自定义按钮,我需要在其中显示 X 个最新的列数据。我更改了类别和数据,但还需要重置缩放。
这可以做到吗?当用户尝试放大/缩小时,我仍然想保留“重置缩放”。PS:我尝试过这样做。zoomOut() 但随后出现“重置缩放”:(
问候查南
我有一个允许放大/缩小的图表。每次用户放大/缩小时,都会出现“重置缩放”。
现在我添加了一个新的自定义按钮,我需要在其中显示 X 个最新的列数据。我更改了类别和数据,但还需要重置缩放。
这可以做到吗?当用户尝试放大/缩小时,我仍然想保留“重置缩放”。PS:我尝试过这样做。zoomOut() 但随后出现“重置缩放”:(
问候查南
帕维尔的召唤建议
chart.xAxis[0].setExtremes(null,null);
确实有效,顺便说一句,如下所示:http: //jsfiddle.net/tvHg6/
但是,虽然图表缩小了,但 resetZoom 按钮仍然悬在周围,不知道如何隐藏它。调用 chart.resetZoomButton.hide() 会隐藏它,但它会永久隐藏。
正如这里建议的那样
chart.zoom()
但请记住,调用chart.zoom()
不会触发chart.events.selection
事件。如果您手动或以编程方式单击“重置按钮”,则会触发$('.highcharts-button').click();
如果要重置外部按钮单击的缩放,请执行以下操作:
$("#YourOwnZoomBtnID").click(function(){
$('.highcharts-button').click();
});
如果你想隐藏 highcharts 的内置重置按钮,那么你可以这样做:
xAxis: { categories: xAxisCategories
,events: {
afterSetExtremes: function() {
$('.highcharts-button').hide();
}
}}
jsfiddle 示例在这里:jsfiddle
谢谢卡利安
我刚刚调用了按钮的单击事件,它工作正常。
给定: v_chart 是 Highcharts 图表的变量;
if (typeof v_chart.resetZoomButton !== 'undefined') {
v_chart.resetZoomButton.element.onclick();
}
chart: { resetZoomButton: { theme: { display: 'none' } } }
buttons: { resetButton: { symbol: 'url(redo_icon.svg)', _titleKey: "resetZoom", y: 20, x: -20, onclick: function () { this.xAxis[0].setExtremes(null,null); this.yAxis[0].setExtremes(null,null) } } }
我们有类似的情况——用户缩放,我们添加了一个“保存这个缩放阶段”按钮,用户点击按钮,我们保存新的最小/最大时间,但现在我们必须让重置缩放按钮消失。
这段代码做到了,如果用户在之后进一步放大,按钮就会返回:
chart.resetZoomButton.hide();
chart.resetZoomButton = chart.resetZoomButton.destroy();