问题
I am working on chart.js plugin with real time chart so i want to pause scrolling chart but when i calling pause dynamically its not working.
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
}
}
i am setting pausestart
initially false after click on pause button set it to true
pause() {
this.pausestart = true;
}
start() {
this.pausestart = false;
}
how can i resolve this issue.
回答1:
You can get a BaseChartDirective
using @ViewChild
, then use the chart
property to set the pause
option and call 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});
}
...
来源:https://stackoverflow.com/questions/51078798/pause-horizontal-scrolling-in-chart-js-for-real-time-data