首页 > 解决方案 > 在 Highcharts 上删除或切换事件

问题描述

如果为图表启用了“x”或“y”轴的缩放,我想设置不同的选择事件。问题是,我无法删除事件,只能向图表添加更多事件。

示例Stackblitz Line:62-66 和 73、77

我想这样做的原因是,如果缩放类型从 x 更改为 y 并且我选择了一个区域(在图表中),则没有 x.min 或 x.max 值并且程序停止正确运行。

编辑: Stackblitz 新

我已经更新了示例以表示我想要做的事情。我使用程序在 xAxis 上打印出最小值和最大值的方法来初始化图表。如果我切换到 Y 轴缩放,我想打印 y 轴的最小值和最大值。问题是他没有删除图表的“选择事件”。

标签: angulareventshighcharts

解决方案


好的,它适用于这些Stackblitz。我不知道为什么我在我的项目中遇到了麻烦或无法工作。我认为删除图表事件后更新缩放类型很重要:

  Highcharts.removeEvent(this.chart, 'selection');
  this.chart.update({ chart: { zoomType: 'y' } });

简短:使用Highcharts.removeEvent();

如果您遇到问题:property is not defined on "Static"只需将以下代码添加到“@types/highcharts/index.d.ts”:

     /**
     * Removes an event that was added with Highcharts#addEvent
     * 
     * @see {@link https://api.highcharts.com/class-reference/Highcharts#removeEvent}
     * 
     * @param element The element to remove events on.
     * @param type The type of events to remove. If undefined, all events are removed from the element.
     * @param cb The specific callback to remove. If undefined, all events that match the element and optionally the type are removed.
     */
     removeEvent(element: HTMLElement | ElementObject | object,
         type?: string,
         cb?: (evt: Event) => void): void;

推荐阅读