score:0

Accepted answer

<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.8.0/chart.bundle.min.js"></script>
<canvas id="nbticketschart" width="50" height="50"></canvas>
<script>
  var nbcanvas = document.getelementbyid("nbticketschart");

  chart.defaults.global.defaultfontfamily = "lato";
  chart.defaults.global.defaultfontsize = 18;

  var densitydata = {
      label: 'nombre de tickets sur la semaine',
      data: [20, 25, 30, 25, 30, 35, 40],
      backgroundcolor: '#336ca6'

  };
  var barchart = new chart(nbcanvas.getcontext('2d'), {
    type: 'bar',
    data: {
    labels: ["j-1", "j-2", "j-3", "j-4", "j-5", "j-6", "j-7"],
    datasets: [densitydata]
  }});

  barchart.options.scales.yaxes[0] = {ticks: {min: 0, max: 100, stepvalue: 20}}
</script>
that was the good solution but doesn't work with char.js 2.8 i use 2.7

score:1

this just frustrated me a fair bit. according to the documentation it seems your method should be working. i can only make it work by setting the scale after creating the chart, like below:

<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.8.0/chart.bundle.min.js"></script>
<canvas id="nbticketschart" width="50" height="50"></canvas>
<script>
  var nbcanvas = document.getelementbyid("nbticketschart");

  chart.defaults.global.defaultfontfamily = "lato";
  chart.defaults.global.defaultfontsize = 18;

  var densitydata = {
      label: 'nombre de tickets sur la semaine',
      data: [20, 25, 30, 25, 30, 35, 40],
      backgroundcolor: '#336ca6'

  };
  var barchart = new chart(nbcanvas.getcontext('2d'), {
    type: 'bar',
    data: {
    labels: ["j-1", "j-2", "j-3", "j-4", "j-5", "j-6", "j-7"],
    datasets: [densitydata]
  }});

  barchart.options.scales.yaxes[0] = {ticks: {min: 0, max: 100, stepvalue: 20}}
</script>

in posting this i've also noticed it doesn't work when the canvas size is 400 by 400. 50 by 50 seems to work...


Related Query

More Query from same tag