0

自分のコードを Google のサンプル コードと比較しましたが、違いは見つかりませんでした。グラフに 3 つではなく 2 つのデータ列しか表示されない理由がわかりません。ブラウザ (Chrome を使用しています) が原因ですか? IEで試してみましたが、同じ問題がありました。

Google のコード例:例

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Chart</title>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">google.load('visualization', '1', {packages: ['corechart']});</script>

<script type="text/javascript">
function drawVisualization2() {
var data = google.visualization.arrayToDataTable([
['Day', 'V5161.198', 'V5161.200', 'V5161.202'],
['27/09/2013', 4.0, 9.0, 4.0],
['29/09/2013', 5.0, 8.0, 4.0]
]);
var options = {title : 'Daily usage of heaters',
vAxis: {title: "Minutes"},
hAxis: {title: "day"},
seriesType: "bars",
series: {2: {type: "line"}} // This is not the root of the problem. If I change it to 3, the chart can be displayed normally but it will not have the average line anymore.
};
var chart = new google.visualization.ComboChart(document.getElementById('chart2_div'));chart.draw(data, options);}google.setOnLoadCallback(drawVisualization2);
</script>
</head>
<body>
<div id="chart2_div" style="width: 1100px; height: 500px;"></div>
</body>
</html>

誰でも私にアドバイスをもらえますか？
どうもありがとうございました。

4

1 に答える 1

0

この行のコードのコメントで次のように言います。series: {2: {type: "line"}}

これは問題の根本ではありません。3 に変更すると、グラフは正常に表示されますが、平均線が表示されなくなります。

オレンジ色の線は、3 つのフィールドの値の平均ではありません。これは、(棒ではなく) 線として書式設定されたデータの 3 番目の列です。平均線が必要な場合は、次のコードが機能します。

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Chart</title>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">google.load('visualization', '1', {packages: ['corechart']});</script>

    <script type="text/javascript">
      function drawVisualization2() {
        var data = google.visualization.arrayToDataTable([
          ['Day', 'V5161.198', 'V5161.200', 'V5161.202'],
          ['27/09/2013', 4.0, 9.0, 4.0],
          ['29/09/2013', 5.0, 8.0, 4.0]
        ]);

        data.addColumn('number', 'Average');

        var average = 0;

        for (var i = 0; i < data.getNumberOfRows(); i++){
          average = 0;
          for (var j = 1; j < data.getNumberOfColumns(); j++){
            average = average + data.getValue(i, j);
          }
          average = average / 3;
          data.setValue(i,4,average);
        }

        var options = {title : 'Daily usage of heaters',
                       vAxis: {title: "Minutes"},
                       hAxis: {title: "day"},
                       seriesType: "bars",
                       series: {3: {type: "line"}} // This is not the root of the problem. If I change it to 3, the chart can be displayed normally but it will not have the average line anymore.
                      };
        var chart = new google.visualization.ComboChart(document.getElementById('chart2_div'));chart.draw(data, options);}google.setOnLoadCallback(drawVisualization2);
    </script>
  </head>
  <body>
    <div id="chart2_div" style="width: 1100px; height: 500px;"></div>
  </body>
</html>
于 2013-09-30T01:01:27.547 に答える