score:1

Accepted answer

instead of setting only one dataset, use one for each distinct data(nepali,...), the down side of this implementation is that you will loss the x label.

var data = [{"0":"nepali","1":"4","sub":"nepali","gpa":"4"},{"0":"english","1":"3","sub":"english","gpa":"3"},{"0":"math","1":"3","sub":"math","gpa":"3"},{"0":"science","1":"2","sub":"science","gpa":"2"},{"0":"social_studies","1":"5","sub":"social_studies","gpa":"5"}]

window.onload = function() {
  var subdata = [];
  var colors = ['red', 'blue', 'green', 'yellow', 'cyan'];

  for (var i in data) {
    subdata.push({
      label: data[i].sub,
      backgroundcolor: colors[i],
      data: [data[i].gpa]
    });
  }

  var densitycanvas = document.getelementbyid('student');

  var planetdata = {
    labels: [''],
    datasets: subdata
  };
  var chartoptions = {
    title: {
      display: true,
      text: 'gpa mark figure'
    },
    scales: {
      yaxes: [{
        ticks: {
          fixedstepsize: 1,
          beginatzero: true
        }
      }],
    },
  };
  var barchart = new chart(densitycanvas, {
    type: 'bar',
    data: planetdata,
    options: chartoptions
  });
}
<script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.8.0/chart.min.js'></script>
<canvas id='student'></canvas>


Related Query

More Query from same tag