仪表针的值在更新时始终从0开始带有Angular 7的HighCharts

问题描述

我正在Angular 7项目中工作，我需要实现highchart gauge。实施的仪表有3根针。其中之一是，它的值每1分钟更新一次。问题是指针总是从0开始重新开始。

我试图将animation:false设置为有效，但是我希望针可以动画，因为它看起来要好得多。

public gauge_options: any = {
      chart: {      
         type: 'gauge',},series: [{
         animation: false,name: 'max',data: [128],dial: {
           backgroundColor: 'red'
         }
       },{
         animation: false,name: 'KW',data: [105],dial: {
           backgroundColor: 'black'
         }
       },name: 'min',data: [21],dial: {
           backgroundColor: 'green'
         }
      }]
   }

以及API响应：

 this.subscription = source.subscribe(val => this.getApiResponse(apiLink).then(
      data => {
    this.gauge_options.series[1].data[0]=data[0]; // data[0] is a number between 0 and 160
    Highcharts.chart('container',this.gauge_options);
   },error => {
    console.log('Something went wrong.');
  })

解决方法

我如下解决了该问题：

   this.subscription = source.subscribe(val => this.getApiResponse(apiLink).then(
      data => {

        Highcharts.chart(this.gauge_container_id,this.gauge_options,function (chart) {
          chart.series[1].points[0].update(data[0]);
       });
   },error => {
    console.log('Something went wrong.');
  })