Highcharts角度图表未从renderer.button事件重新显示

Question

在图表中，有2个自定义按钮来更新系列，以按百分比（％）或按计数重绘图表（视图切换）。在renderer.button的回调函数中，当我单击“计数”按钮时，我将通过更改数据对象中y的值并使用修改后的序列数据调用chart.update()方法来更新序列数据

const seriesData: any = this.data;
this.update(seriesData, true);
this.redraw();

图表不会自动重绘，仅当我放大或缩小浏览器或执行任何其他操作时，才会重绘。这里缺少什么？

Stackblitz

Answer 1

您正在努力解决的问题是，在render函数中调用update方法会创建一个无限循环。

更新渲染调用->更新重绘图表->渲染再次调用->渲染调用更新-> ...

避免这种情况的方法之一是使用一些布尔值[['flags'”来控制一次更新将被调用。

带有

console.log

的简单演示，以测试流程：https://jsfiddle.net/BlackLabel/acoxmhdw/

let chartForUpdate = true;

Highcharts.chart('container', {

  chart: {
    events: {
      render() {
        let chart = this;
                console.log('test redraw call 1')
        if (chartForUpdate) {
          chartForUpdate = false;
          chart.series[0].update({
            data: [5, 10]
          })
          console.log('test condition IF call')
        }
        console.log('test redraw call 2')
                chartForUpdate = true
      }
    }
  },

  series: [{
    data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
  }]
});