Chartjs-Create grouped-bar using chart.js, php and mysql

by

1đź‘Ť

Unfortunately I don’t know much about php. Therefore I can only partially answer your question.

data.labels should contain an entry for each day. What you further need is one dataset for each user and that’s it.

Please take a look at below code snippet and see how it could work.

new Chart("chart", {
  type: 'bar',
  data: {
    labels: ["01-Sep-20", "02-Sep-20", "03-Sep-20"],
    datasets: [{
      label: "cs",
      backgroundColor: "red",
      data: [229, 200, 198]
    },
    {
      label: "finance",
      backgroundColor: "green",
      data: [162, 150, 178]
    },
    {
      label: "credit",
      backgroundColor: "blue",
      data: [89, 156, 90]
    },
    {
      label: "it",
      backgroundColor: "orange",
      data: [89, 55, 112]
    }]
  },
  options: {
    scales: {
      yAxes: [{
        ticks: {
          beginAtZero: true
        }
      }]
    }
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<canvas id="chart" height="90"></canvas>

Leave a comment