設定し、最大値は

Question

私はそのためだけ私が得たグラフは、オプションで次の100

の最大値まで行きたいので、割合を示すように棒グラフを作成しています：

var options = { 
     legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"background-color:<%=segments[i].fillColor%>\"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>", 
     tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %>", 
     maintainAspectRatio: false, 
     responsive: true, 
     animation: false, 
     scaleBeginAtZero: true, 
     scales: { 
      yAxis: [{ 
       ticks: { 
        beginAtZero:true, 
        min: 0, 
        max: 100 
       } 
      }] 
     } 
    }; 

グラフの負荷が、私のデータは、100％の値が含まれていますが、代わりにバーグラフのY軸の値がそのあなたが提供することができます任意の助けのために120

おかげまで行く100です。

Answer 1

これが機能しない理由は、使用しているChartJSのバージョンに関連するだけです。 ChartJSバージョン1.xを使用しているため、現在の縮尺オプションはチャートに適用されません。

あなたはむしろ、以下のスケールオプションを使用する必要があります

...

scaleOverride: true, 
scaleSteps: 10, 
scaleStepWidth: 10, 

ᴡᴏʀᴋɪɴɢᴇxᴀᴍᴘʟᴇ

var ctx = document.getElementById("canvas").getContext("2d"); 
 
var data = { 
 
    labels: ['Jan', 'Feb', 'Mar'], 
 
    datasets: [{ 
 
     label: "# of votes", 
 
     fillColor: "#07C", 
 
     data: [50, 80, 200] 
 
    }] 
 
}; 
 

 
var myBarChart = new Chart(ctx).Bar(data, { 
 
    scaleOverride: true, 
 
    scaleSteps: 10, // number of ticks 
 
    scaleStepWidth: 10, // tick interval 
 
    scaleBeginAtZero: true 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js"></script> 
 
<canvas id="canvas" width="350" height="200"></canvas>