chartjs-plugin-streaming #25
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chartjs-plugin-streaming.min.js"></script>
<canvas id="chart"></canvas>
JavaScript
var ctx = document.getElementById('chart').getContext('2d');
var chart = new Chart(ctx, {
type: 'line',
data: { datasets: [{ data: [] }, { data: [] }] },
options: {
scales: {
xAxes: [{
type: 'realtime',
time: {
displayFormats: {
second: 'x',
minute: 'x'
}
},
ticks: {
callback: function(v) {
console.log(v);
return moment(v).zone("+01:00").format('h:mm:ss a');
}
}
}]
},
plugins: {
streaming: {
onRefresh: function(chart) {
chart.data.datasets.forEach(function(dataset) {
dataset.data.push({
x: Date.now(),
y: Math.random()
});
});
}
}
}
}
});