Chart.js - 2つのyAxisを持つ折れ線グラフ： "TypeError：yScale is undefined"

Question

Chart.jsに2つのyAxisを持つ折れ線グラフを表示しようとしています。

マイコード：

window.onload = function() { 
 
    var ctx = document.getElementById("chart").getContext("2d"); 
 
    var myChart = new Chart(ctx, { 
 
    type: "line", 
 
    data: { 
 
     "labels": [ 
 
     "01.12.2015", 
 
     "02.12.2015", 
 
     "03.12.2015", 
 
     "04.12.2015", 
 
     "30.12.2015" 
 
     ], 
 
     "datasets": [{ 
 
     "label": "DEA Burrweiler Druck Abgabe", 
 
     "fill": "false", 
 
     yAxisID: "y-axis-0", 
 
     "data": [ 
 
      8.7913, 
 
      8.6985, 
 
      8.7914, 
 
      8.7948, 
 
      8.7882 
 
     ] 
 
     }, { 
 
     "label": "DEA Burrweiler Druck Zulauf", 
 
     "fill": "false", 
 
     yAxisID: "y-axis-0", 
 
     "data": [ 
 
      4.5997, 
 
      4.5526, 
 
      4.5915, 
 
      4.5937, 
 
      4.5795 
 
     ] 
 
     }, { 
 
     "label": "DMS Flemlingen Durchfluss", 
 
     "fill": "false", 
 
     yAxisID: "y-axis-1", 
 
     "data": [ 
 
      1.9588, 
 
      2.4226, 
 
      2.1392, 
 
      2.223, 
 
      1.9048 
 
     ] 
 
     }] 
 
    }, 
 
    options: { 
 
     yAxes: [{ 
 
     position: "left", 
 
     "id": "y-axis-0" 
 
     }, { 
 
     position: "right", 
 
     "id": "y-axis-1" 
 
     }] 
 
    } 
 

 
    }); 
 
};

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.0/Chart.min.js"></script> 
 
<canvas id="chart" width="400" height="400"></canvas>

エラーは言う： "例外TypeError：YSCALEは未定義である" 私はデータセット内yAxisIDオプションを削除すると

、チャートが表示されますが、 1つのyAxisでのみ。

window.onload = function() { 
 
     var ctx = document.getElementById("chart").getContext("2d"); 
 
     var myChart = new Chart(ctx, { 
 
     type: "line", 
 
     data: { 
 
      "labels": [ 
 
      "01.12.2015", 
 
      "02.12.2015", 
 
      "03.12.2015", 
 
      "04.12.2015", 
 
      "30.12.2015" 
 
      ], 
 
      "datasets": [{ 
 
      "label": "DEA Burrweiler Druck Abgabe", 
 
      "fill": "false", 
 
      "data": [ 
 
       8.7913, 
 
       8.6985, 
 
       8.7914, 
 
       8.7948, 
 
       8.7882 
 
      ] 
 
      }, { 
 
      "label": "DEA Burrweiler Druck Zulauf", 
 
      "fill": "false", 
 
      "data": [ 
 
       4.5997, 
 
       4.5526, 
 
       4.5915, 
 
       4.5937, 
 
       4.5795 
 
      ] 
 
      }, { 
 
      "label": "DMS Flemlingen Durchfluss", 
 
      "fill": "false", 
 
      "data": [ 
 
       1.9588, 
 
       2.4226, 
 
       2.1392, 
 
       2.223, 
 
       1.9048 
 
      ] 
 
      }] 
 
     }, 
 
     options: { 
 
      yAxes: [{ 
 
      position: "left", 
 
      "id": "y-axis-0" 
 
      }, { 
 
      position: "right", 
 
      "id": "y-axis-1" 
 
      }] 
 
     } 
 

 
     }); 
 
    };

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.0/Chart.min.js"></script> 
 
<canvas id="chart" width="400" height="400"></canvas>

私は、チャートオプションで定義されたY軸を持っています。それで問題は何ですか、私は何が欠けていますか？

Answer 1

yAxesはそう

... 
options: { 
    scales: { 
     yAxes: [{ 
     .. 

---

フィドルのように、オプションの下で財産scalesの下でなければなりません - http://jsfiddle.net/dahd27d7/