跳过y轴上的小数点在chartJS

Question

我正在使用this库在我的web应用程序中绘制图表。问题是我的y轴有小数点。你可以看到在下面的图片

有没有一种方法，我可以限制它只有数字？

这是我的代码

var matches = $("#matches").get(0).getContext("2d"); 

var data = { 
     labels: labelsFromCurrentDateTillLastWeek, 
     datasets: [ 
      { 
       label: "Last Weeks Matches", 
       fillColor: "rgba(220,220,220,0.2)", 
       strokeColor: "rgba(220,220,220,1)", 
       pointColor: "rgba(220,220,220,1)", 
       pointStrokeColor: "#fff", 
       pointHighlightFill: "#fff", 
       pointHighlightStroke: "rgba(220,220,220,1)", 
       data: result 
      } 
     ] 
    }; 

    var options = { 
     scaleLabel: function (label) { 
      return Math.round(label.value); 
     } 
    }; 

    var myLineChart = new Chart(matches, { 
     type: 'bar', 
     data: data, 
     options: options 

    }) 

Answer 1

在chartjs 2.x中，你可以通过一个userCallback到y轴刻度栏中选择一个选项。在此您可以检查标签是一个整数

这里有一个例子

options = { 
    scales: { 
     yAxes: [{ 
      ticks: { 
       beginAtZero: true, 
       userCallback: function(label, index, labels) { 
        // when the floored value is the same as the value we have a whole number 
        if (Math.floor(label) === label) { 
         return label; 
        } 

       }, 
      } 
     }], 
    }, 
} 

fiddle example

Answer 2

另一种方法是如下使用fixedStepSize选项：

options = { 
    scales: { 
     yAxes: [{ 
      ticks: { 
       fixedStepSize: 1 
      } 
     }], 
    }, 
};