Highcharts angular 获取图例项目状态

【问题标题】：Highcharts angular Get Legend Item StatusHighcharts angular 获取图例项目状态
【发布时间】：2021-09-29 09:09:55
【问题描述】：

我在我的 Angular 项目中创建了一个共享的 HighCharts 组件。我正在从所有消费组件向它传递图表选项，并且我正在尝试访问消费组件中每个系列的“可见”属性。即使我切换图表中的图例，我得到的这些值似乎也没有更新状态

Here is the implementation 我试图通过点击应用组件中的按钮来访问状态。

【问题讨论】：

您尝试的方式无法获得系列的实际值。您传递选项的值，但它不是双向绑定。（而且我怀疑 Highcharts 是否支持双向选项绑定）。所以你只读取你传递给图表的初始值。

标签： angular highcharts

【解决方案1】：

正如我在 cmets 中提到的。您只是在重新阅读期权的价值。您需要其他内容才能获得该系列的最新状态。 render 事件可以帮助你。像下面这样的解决方法可能适合您的需要：

  chartOptions = {
    ...new progressMonitoringGraphConfig(this.mockData).graphConfig,
    chart: {
      events: {
        render: (ctx) => {
          this.seriesVisibility = ctx.target.series.map(
            ({ visible }) => visible
          );
        },
      },
    },
  };
  seriesVisibility = this.chartOptions.series.map(({ visible }) => visible);

  printStatus() {
    console.log(this.seriesVisibility);
  }

Stackblitz

【讨论】：