71

Chart.jsを使用して Web サイトに含めたいグラフがあります。Y 軸には、整数ではなく実数が表示されます。数値を整数に変更するにはどうすればよいですか?

これが私が今持っているものの写真です：

実数を含む現在のチャート

そして、これはコードです：

var lineChartData = {

    labels : ["2013/04/01","2013/03/31", "2013/03/30", "2013/03/29", "2013/03/28","2013/03/27", "2013/03/26"],

    datasets : [
        {
            fillColor : "rgba(151,187,205,0.5)",
            strokeColor : "rgba(151,187,205,1)",
            pointColor : "rgba(151,187,205,1)",
            pointStrokeColor : "#fff",
            data : ["0", "2","1", "0", "1","0","1"]
        }
    ]

}

var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Bar(lineChartData);
4

7 に答える 7

149

新しいバージョンでは次のように処理しました。

new Chart(ctx, {
  type: 'bar',
  data: chartData,
  options: {
    scales: {
      yAxes: [{
        ticks: {
          beginAtZero: true,
          callback: function(value) {if (value % 1 === 0) {return value;}}
        }
      }]
    }
  }
});
于 2016-08-14T18:57:50.837 に答える
54

Chart.jsの新しいバージョン 2 を使用しているときに、既存の回答をうまく機能させることができなかったので、V2 でこの問題を解決するために見つけたものを次に示します。

new Chart(ctx, {type: 'bar', data: barChartData,
  options:{ 
    scales: {
      yAxes: [{
        ticks: {
          stepSize: 1
        }
      }]
    }
  }
});
于 2016-06-19T10:32:52.057 に答える
9

グローバル構成セクションで、Chart.jsのドキュメントを確認してください。

// Boolean - 描画スペースがあってもスケールを float ではなく整数に固定するかどうか scaleIntegersOnly: true,

于 2015-03-04T18:39:24.783 に答える
7

ゼロ以外の数で開始したい場合は、それを考慮する必要があります。

var step  = 5;
var max   = 90
var start = 40;
new Chart(income).Bar(barData, {
    scaleOverride: true,
    scaleSteps: Math.ceil((max-start)/step),
    scaleStepWidth: step,
    scaleStartValue: start
});
于 2014-09-15T09:53:04.943 に答える
0

上記の Ben Bloodworth が述べたように、より簡単な方法はオプション (精度: 0) を追加することです。

現在、バージョン 3.7.1 で正常に動作しています

 options: {
            scales: {
                y: {
                    ticks: {
                        precision: 0
                    }
                }
            }
        }
于 2022-02-23T15:16:56.403 に答える