Приостановить горизонтальную прокрутку в chart.js для данных в реальном времени

Question

Я работаю над плагином chart.js с графиком в реальном времени, поэтому я хочу приостановить прокрутку графика, но при динамическом вызове pause он не работает.

pausestart:boolean;

plugins: {
      streaming: {
          onRefresh: function(chart: any) {
            chart.data.datasets.forEach(function(dataset: any) {
              dataset.data.push({
                x: Date.now(),
                y: Math.random()
              });
            });
          },
          duration: 12000,
          refresh: 100,
          delay: 1000,
          frameRate: 60,
          pause: this.pausestart
        }
      }

я устанавливаю pausestart изначально ложно, после нажатия на кнопку паузы установите значение true

pause() {
    this.pausestart = true;
  }

  start() {
    this.pausestart = false;
  }

как я могу решить эту проблему.

Answer 1

Вы можете получить BaseChartDirective с помощью @ViewChild, затем использовать свойство chart, чтобы установить параметр pause, и вызвать update().

import { Component, ViewChild } from '@angular/core';
import { BaseChartDirective } from 'ng2-charts';

export class AppComponent {
  @ViewChild(BaseChartDirective) chart: BaseChartDirective;

  pause() {
    this.chart.chart.options.plugins.streaming.pause = true;
    this.chart.chart.update({duration: 0});
  }

  start() {
    this.chart.chart.options.plugins.streaming.pause = false;
    this.chart.chart.update({duration: 0});
  }

  ...