Chartjs-How to create a histogram in charts.js with MYSQL data

by

0👍

Something like this

const data = [
  {x: 0.5,y: 100},
  {x: 1.5,y: 100},
  {x: 2.5,y: 200},
  {x: 3.5,y: 50},
  {x: 4.5,y: 50},
  {x: 5.5,y: 50},
  {x: 6.5,y: 50},
  {x: 7.5,y: 100},
  {x: 8.5,y: 200},
  {x: 9.5,y: 300},
  {x: 10.5,y: 400},
  {x: 11.5,y: 500},
  {x: 12.5,y: 600},
  {x: 13.5,y: 700},
  {x: 14.5,y: 700},
  {x: 15.5,y: 750},
  {x: 16.5,y: 500},
  {x: 17.5,y: 400},
  {x: 18.5,y: 800},
  {x: 19.5,y: 800},
  {x: 20.5,y: 800},
  {x: 21.5,y: 600},
  {x: 22.5,y: 300},
  {x: 23.5,y: 100},
]
var ctx = document.getElementById("myChart").getContext('2d');
var mixedChart = new Chart(ctx, {
  type: 'bar',
  data: {
    datasets: [{
      data: data.map(item => item.y),
    }],
    labels: data.map(item => item.x),
  },
});

Leave a comment