Chartjs栏数据集标签未显示

时间:2017-11-19 06:13:33

标签: chart.js

尝试比较今年与去年的条形图和数据集标签"今年" &安培; "前一年"没有显示。这个东西在并排比较多个数据集时特别方便,因此非常感谢任何帮助。 顺便说一句,我的chartjs版本是2.1.4

  var chartdata = {
    type: 'bar',
    data: {
      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
      // labels: month,
      datasets: [
        {
          label: 'this year',
          backgroundColor: '#26B99A',
          data: sold1
        },
        {
          label: 'previous year',
          backgroundColor: '#03586A',
          data: sold2
        }
      ]
    }
  };

2 个答案:

答案 0 :(得分:4)

将xAxis的autoSkip设置为false:

scales: {
  xAxes: [{
      beginAtZero: true,
      ticks: {
         autoSkip: false
      }
  }]
}

答案 1 :(得分:0)

检查您的sold1sold2

console.log(sold1);
console.log(sold2);

例如,这是有效的:

var chartdata = {
    {
        type: 'bar',
        data: {
          labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
          // labels: month,
          datasets: [
            {
              label: 'this year',
              backgroundColor: '#26B99A',
              data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
            },
            {
              label: 'previous year',
              backgroundColor: '#03586A',
              data: [2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13]
            }
          ]
        }
    }
};



var ctx = document.getElementById('chartContainer').getContext('2d');
new Chart(ctx, chartdata);

JSFiddle https://jsfiddle.net/1davgzmh/1/