charts-plugin-streaming #5
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.min.js"></script>
<script src="https://rawgit.com/nagix/nagix.github.io/chartjs/chartjs-plugin-streaming.5.js"></script>
<canvas id="chart"></canvas>
<p>
<input id="Button1" type="button" value="Pause" onclick="Button1_Click()"/>
</p>
JavaScript
var ctx = document.getElementById('chart').getContext('2d');
var chart = new Chart(ctx, {
type: 'line',
data: {
datasets: [{
data: []
}, {
data: []
}]
},
options: {
scales: {
xAxes: [{
type: 'realtime'
}]
},
plugins: {
streaming: {
delay: 2000,
onRefresh: onRefresh
}
}
}
});
function onRefresh(chart) {
chart.data.datasets.forEach(function(dataset) {
dataset.data.push({
x: Date.now(),
y: Math.random()
});
});
}
function Button1_Click() {
chart.defaults.global.plugins.streaming = false;
}