3

グラフの一部のデータが表示されないという点で、Google Visualization API に問題があります。グラフは非常に単純で、4 つの列と 2 つの行があります。

http://savedbythegoog.appspot.com/?id=ae0853b788af3292b5547a5b7f1224aed76abfff

 function drawVisualization() {
      // Create and populate the data table.

      var data_table = new google.visualization.DataTable();
      data_table.addColumn({"type": "date","label": "Date"});
      data_table.addColumn({"type": "number","label": "A"});
      data_table.addColumn({"type": "number","label": "B"});
      data_table.addColumn({"type": "number","label": "C"});

      data_table.addRow([{v: new Date(2013, 5, 26)}, {v: 1}, {v: 0}, {v: 0}]);
      data_table.addRow([{v: new Date(2013, 5, 27)}, {v: 2}, {v: 1}, {v: 0.5}]);

      var chart = new google.visualization.ColumnChart(document.getElementById('visualization'));
      chart.draw(data_table, {
          legend: "bottom"
      });

  }

生成されると、グラフは最初の行 (2013 年 5 月 26 日) には何も表示せず、2 番目の行には 2 と 1 の値のみを表示します (0.5 を省略)。

これはGoogle の縦棒グラフに似ていると思います データがありません

誰にもアイデアはありますか？

4

1 に答える 1

5

それで、Googleは解決策をいくらか提供したようです...

https://developers.google.com/chart/interactive/docs/customizing_axes#Discrete_vs_Continuous

ヘルプ！チャートがおかしくなった！

私のドメイン軸タイプは文字列ではありませんが、個別のドメイン軸が必要です:

これがあなたをひどく動揺させるなら、次のいずれかを行うことができます：

  1. 最初のデータ テーブル列の型を文字列に変更します。
  2. DataView をアダプターとして使用して、最初のデータ テーブル列の型を文字列に変換します。

したがって、上記のチャートの解決策は、次を追加することでした。

//Create a DataView from the data_table
var dataView = new google.visualization.DataView(data_table);

//Set the first column of the dataview to format as a string, and return the other columns [1, 2 and 3]
dataView.setColumns([{calc: function(data, row) { return data.getFormattedValue(row, 0); }, type:'string'}, 1, 2, 3]);

したがって、関数全体は次のようになりました。

function drawVisualization() {
var data_table = new google.visualization.DataTable();
  data_table.addColumn({"type": "date","label": "Date"});
  data_table.addColumn({"type": "number","label": "A"});
  data_table.addColumn({"type": "number","label": "B"});
  data_table.addColumn({"type": "number","label": "C"});

  data_table.addRow([{v: new Date(2013, 5, 26)}, {v: 1}, {v: 0}, {v: 0}]);
  data_table.addRow([{v: new Date(2013, 5, 27)}, {v: 2}, {v: 1}, {v: 0.5}]);

  //Create a DataView from the data_table
  var dataView = new google.visualization.DataView(data_table);

  //Set the first column of the dataview to format as a string, and return the other columns [1, 2 and 3]
  dataView.setColumns([{calc: function(data, row) { return data.getFormattedValue(row, 0); }, type:'string'}, 1, 2, 3]);
  var chart = new google.visualization.ColumnChart(document.getElementById('visualization'));
  chart.draw(dataView, {
      legend: "bottom"
  });
}
于 2013-07-03T03:21:04.633 に答える