[Chartjs]-How to transform changing data to be visualized in a chart.js

by

0👍

✅

Based on your example you can simply iterate updatingDataArray and push each value to a separate array that you then pass to Chart.js:

var updatingDataArray = [
  [0, 14],
  [1, 11],
  [2, 15],
  [3, 12],
  [4, 8],
  [5, 8],
  [6, 9],
  [7, 9],
  [8, 9],
  [9, 7]
];

var labels = [],
  values = [];

updatingDataArray.forEach(function(val, idx) {
  labels.push(val[0]);
  values.push(val[1]);
});

new Chart(document.getElementById("chart"), {
  type: "line",
  data: {
    labels: labels,
    datasets: [{
      data: values
    }]
  },
  options: {}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js"></script>
<canvas id="chart"></canvas>

Leave a comment