無法自定義Chart.js

我對Chart.js非常陌生，在下載Chart.js時，我正在處理包含的小節樣本。我閱讀了文檔，示例頁面似乎有點不同。我試着按照文檔和在線教程取得成功，但在樣本頁面上工作會產生更好的結果。無法自定義Chart.js

但是我似乎無法定製任何東西。我試圖在0開始比例值，但它不適用。這發生在我嘗試做的所有事情上（字體顏色等等等）等等。這裏的其餘選項都包含在文件和工作中。我不確定我做錯了什麼。

<head> 
<title>Bar Chart</title> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script src="../dist/Chart.bundle.js"></script> 
<style> 
canvas { 
    -moz-user-select: none; 
    -webkit-user-select: none; 
    -ms-user-select: none; 
} 
</style> 
</head> 

<body> 
<div id="container" style="width: 75%;"> 
    <canvas id="canvas"></canvas> 
</div> 

<script> 
    var barChartData = { 
     labels: ["Week 1", "Week 2"], 
     datasets: [{ 
      label: 'Round 1', 
      backgroundColor: "rgba(220,220,220,0.5)", 
      data: [12,15] 
     }, { 
      label: 'Round 2', 
      backgroundColor: "rgba(151,187,205,0.5)", 
      data: [20,17] 
     }] 

    }; 

    window.onload = function() { 
     var ctx = document.getElementById("canvas").getContext("2d"); 
     window.myBar = new Chart(ctx, { 
      type: 'bar', 
      data: barChartData, 
      scaleOverride:true, 
      scaleStartValue: 0, 

      options: { 
       elements: { 
        rectangle: { 
         borderWidth: 2, 
         borderColor: 'rgb(0, 255, 0)', 
         borderSkipped: 'bottom' 
        } 
       }, 
       responsive: true, 
       legend: { 
        position: 'top', 
       }, 
       title: { 
        display: true, 
        text: 'Chart.js Bar Chart' 
       } 
      } 
     }); 

    }; 
</script> 
</body>

來源

2016-04-19 user5854648

您可以使用tick.beginAtZero

options: { 
    scales: { 
     yAxes: [{ 
     ticks: { 
      beginAtZero: true 
     } 
     }], 
    }, 
    ...

小提琴 - http://jsfiddle.net/7mse8p9e/

來源

2016-04-19 22:31:07 potatopeelings

無法自定義Chart.js

回答

相關問題