score:1

Accepted answer

the default behavior of chart.js is to center charts, looking at the picture i am doubting that you have supplied two values in the labels array of data (not sure) if that's not the case please see this fiddle (http://jsfiddle.net/m5rq6bdj/2/) or the below code, which may help.

var ctx = document.getelementbyid("mychart").getcontext('2d');
var mychart = new chart(ctx, {
  type: 'bar',
  data: {    
    datasets: [{
          label: 'blueberries',
          data: [2],
          bordercolor: 'blue',
          fill: false,
          linetension: 0,
          borderdash: [10,5]
        }, {
          label: 'apples',
          data: [1],
          bordercolor: 'red',
          fill: false,
          linetension: 0.1
        }]
  },
  options: {
    responsive: true,
    maintainaspectratio: false,
    scales: {
      xaxes: [{
        display: false,
        ticks: {
          scalebeginatzero: false
        }
      }],
      yaxes: [{
        display: true,
        ticks: {
          beginatzero: true,
          fontsize: 12,
          fontfamily: 'lato, sans-serif'
        },
        scalelabel: {
          display: true,
          labelstring: 'fruits counted',
          fontstyle: 'bold',
          fontfamily: 'lato, sans-serif'
        }
      }]
    },
    legend: {
      display: true,
      position: 'bottom',
      labels: {
        fontcolor: '#333',
        fontfamily: 'lato, sans-serif',
      }
    }
  }
});

Related Query

More Query from same tag