Wie können die Y-Achsenwerte von reellen Zahlen in Integer in Diagrammjs geändert werden?

Question

Ich habe ein Diagramm, das ich in meine Website mit Chart.js aufnehmen möchte. In der Y-Achse gibt es mir reelle Zahlen anstelle von ganzen Zahlen, und das ist, was ich will, ist hier ein Bild von dem, was ich habe jetzt:

Und das ist der Code:

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); 

Answer 1

Versuchen Sie dies, wobei max der höchste Wert Ihrer Daten ist.

var steps = 3; 
new Chart(ctx).Bar(plotData, { 
    scaleOverride: true, 
    scaleSteps: steps, 
    scaleStepWidth: Math.ceil(max/steps), 
    scaleStartValue: 0 
}); 

Answer 2

Wenn Sie als Null in einer anderen Nummer starten möchten, müssen Sie das berücksichtigen:

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 
}); 

Answer 3

Überprüfen Sie die Chart.js Dokumentation, in der globalen Konfigurationsabschnitt:

// Boolean - Ob der Maßstab bei Ganzzahlen bleiben soll, nicht schwebt, auch wenn Zeichenraum vorhanden ist scaleIntegersOnly: true,

Ich hoffe, es hilft.

Answer 4

Ich war nicht in der Lage, die vorhandenen Antworten zu bekommen, für mich zu arbeiten, wenn die neue Version 2 von Chart.js verwenden, so ist hier, was ich dieses Problem in V2 lösen gefunden:

new Chart(ctx, {type: 'bar', data: barChartData, 
    options:{ 
    scales: { 
     yAxes: [{ 
     ticks: { 
      stepSize: 1 
     } 
     }] 
    } 
    } 
}); 

Answer 5

Ich behandelte es so in der neuen Version:

new Chart(ctx, { 
    type: 'bar', 
    data: chartData, 
    options: { 
    scales: { 
     yAxes: [{ 
     ticks: { 
      beginAtZero: true, 
      callback: function(value) {if (value % 1 === 0) {return value;}} 
     } 
     }] 
    } 
    } 
});