要解决“Angular6 chartjs-plugin-streaming的onRefresh()方法不起作用”的问题,您可以尝试以下解决方法:
npm install chart.js chartjs-plugin-streaming --save
import { Component, OnInit } from '@angular/core';
import { Chart } from 'chart.js';
import 'chartjs-plugin-streaming';
@Component({
selector: 'app-chart',
templateUrl: './chart.component.html',
styleUrls: ['./chart.component.css']
})
export class ChartComponent implements OnInit {
chart: any;
ngOnInit() {
this.chart = new Chart('canvas', {
type: 'line',
data: {
datasets: [{
data: []
}]
},
options: {
plugins: {
streaming: {
onRefresh: function(chart: any) {
// 在这里执行您想要的操作
console.log('Chart refreshed!');
}
}
}
}
});
}
}
import { Component, OnInit } from '@angular/core';
import { Chart } from 'chart.js';
import 'chartjs-plugin-streaming';
@Component({
selector: 'app-chart',
templateUrl: './chart.component.html',
styleUrls: ['./chart.component.css']
})
export class ChartComponent implements OnInit {
chart: any;
ngOnInit() {
this.chart = new Chart('canvas', {
type: 'line',
data: {
datasets: [{
data: []
}]
},
options: {
plugins: {
streaming: {
onRefresh: function(chart: any) {
console.log('Chart refreshed!');
}
}
}
}
});
// 模拟数据刷新
setInterval(() => {
this.chart.update({ preservation: true });
this.chart.streaming.onRefresh(this.chart);
}, 1000);
}
}
请注意,在示例代码中,我们使用setInterval()
函数模拟了数据刷新事件,并在每次刷新时调用了onRefresh()
方法。
通过以上步骤,您应该能够解决“Angular6 chartjs-plugin-streaming的onRefresh()方法不起作用”的问题,并在刷新时正确调用onRefresh()方法。