突出显示如何在单击重置缩放按钮事件中捕获和插入逻辑

highcharts how to catch and insert logic in click reset zoom button event

本文关键字：事件 插入 按钮 缩放 显示 单击      更新时间：2023-09-26

我正在使用高图表，想在单击重置缩放按钮事件中插入一些逻辑，但我没有找到一个很好的方法。在StackOverflow中搜索并找到最佳答案是： 

event.srcElement.firstChild.data == "Reset zoom"

但是这种方式有一个问题，当我们单击"重置缩放"按钮的一角时，不会触发事件。只有当我们以这种方式单击文本"重置缩放"的 tSpan 时，才会起作用。想问是否有其他解决方案。

只需使用 setExtremes 事件，请参阅：http://jsfiddle.net/BlackLabel/pjy9682s/3/

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        zoomType: 'x'
    },
    xAxis: {
        events: {
            setExtremes: function (e) {
                if(typeof e.min == 'undefined' && typeof e.max == 'undefined'){
                     console.log('reset zoom clicked');   
                } else {
                     console.log('zoom-in');   
                }
            }
        }
    },
    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0]
    }]
});

Highcharts提供了一个名为选择的事件

chart:{
  events: {
    selection: function() { /* your code here */ }
  }
}

这把小提琴将帮助您 http://jsfiddle.net/M7cfm/

相关文章：