Chartjs改變橫軸值

Question

什麼選項Chartjs設置改變水平軸的值，從下面的代碼具有100鹼值，而不是0

Chart to look like this, but y-axis base should be a 100 and not 0 as shown in the graph here.

所以，如果一個70的值繪製在條形圖上，那麼它的y軸應該從100開始到70，而120的值應該從100開始到120的y軸。

Mock up, Excel version of how it should look like.

我試圖在這裏的一些答案，但無法在Chartjs實現這一目標。

說明：我正在從chartjs網站獲取示例代碼。但是，仍然無法根據需要獲得具體的縮放比例。

Chartjs 2.6.0

var MONTHS = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; 
    var color = Chart.helpers.color; 
    var barChartData = { 
     labels: ["January", "February", "March", "April", "May", "June", "July"], 
     datasets: [{ 
      label: 'Dataset 1', 
      backgroundColor: color(window.chartColors.red).alpha(0.5).rgbString(), 
      borderColor: window.chartColors.red, 
      borderWidth: 1, 
      data: [140,10,60,69,56,110] 

     }, { 
      label: 'Dataset 2', 
      backgroundColor: color(window.chartColors.blue).alpha(0.5).rgbString(), 
      borderColor: window.chartColors.blue, 
      borderWidth: 1, 
      data: [50,120,70,98,130,34] 
     }] 

    }; 

    window.onload = function() { 
     var ctx = document.getElementById("canvas").getContext("2d"); 
     window.myBar = new Chart(ctx, { 
      type: 'bar', 
      data: barChartData, 
      options: { 
       responsive: true, 
       legend: { 
        position: 'top', 
       }, 
       title: { 
        display: true, 
        text: 'Chart.js Bar Chart' 
       } 
      } 
     }); 

    }; 

編輯刪除隨機數，並用於測試目的編輯的常量。我目前正在研究Chartjs的插件。此選項可能不適用於分佈式軟件包。

Answer 1

解決方法答：

從下面搗鼓

所以，我用堆疊在Y和X軸，以獲得預期的效果。第一個數據集（只是一個偏移量數據集）用作堆疊第二個數據集（實際）以獲得所需效果的基礎。

fiddle

var ctx = document.getElementById("myChart").getContext("2d"); 
var data = { 
    labels: ["January", "February", "March", "April", "May", "June"], 
    datasets: [{ 
    label: "Offset", 
    backgroundColor: "transparent", 
    data: [50,100,70,60,100,100] 
    },{ 
    label: 'Actual Dataset', 
    backgroundColor: 'Blue', 
    borderWidth: 1, 
    data: [50,20,30,40,30,70] 
    }] 
}; 

var myBarChart = new Chart(ctx, { 
    type: 'bar', 
    data: data, 
    options: { 
    scales: { 
     xAxes: [{ 
     stacked: true 
     }], 
     yAxes: [{ 
     stacked: true, 
     }] 
    }, 
    } 
}); 

Answer 2

在你的選擇只需添加

ticks: { 
     min:100 
     } 

y軸鱗下你的選擇應該是這樣的。

options: { 
       scales: { 
         yAxes:[{ 
           ticks: { 
             min:10 
             } 
    }], 
    } 
       responsive: true, 
       legend: { 
        position: 'top', 
       }, 
       title: { 
        display: true, 
        text: 'Chart.js Bar Chart' 
       }, 
      } 

P.s：檢查縮進，因爲我沒有使用編輯器。

編輯可能是你在這種情況下堆疊已經刪除了堆棧類型。請參閱基於的@adeel建議這個fiddle