暂停chart.js中的水平滚动以获取实时数据 [英] Pause horizontal scrolling in chart.js for real time data
本文介绍了暂停chart.js中的水平滚动以获取实时数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用带有实时图表的chart.js插件,因此我想暂停滚动图表,但是当我动态调用pause时,它不起作用.
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
}
}
我将 pausestart
设置为false,然后单击暂停"按钮将其设置为true
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.
推荐答案
您可以使用 @ViewChild
获取 BaseChartDirective
,然后使用图表
属性以设置 pause
选项并调用 update()
.
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});
}
...
这篇关于暂停chart.js中的水平滚动以获取实时数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文