0

在尝试使用谷歌可视化 API 可视化这个散点图时，我遇到了一个非常奇怪的问题。

基本上，如果我将第一个数据点作为 [0,0] 一切都会好起来的，但如果删除 [0,0] 作为第一个点，图表将不会生成。我检查了控制台，这就是它所说的：

“未捕获的语法错误：意外的令牌 <
未捕获的错误：0,0 中的值无效”

为什么第一个点必须是[0,0]？

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Camera','Avg Rating'],
          [ {v:6000, f: 'Canon EOS-1Ds Mark III'}, 60],
          [ {v:5000, f: 'Canon EOS-1Ds Mark II'}, 50],
          [ {v:4000, f: 'Canon EOS-1D Mark IV'}, 40]
        ]);

        var options = {
          title: 'Breakdown of Camera Models by Price, Photo Rating and Brand',
          hAxis: {title: 'Price (USD)', minValue: 0, maxValue: 7500},
          vAxis: {title: 'Avg Rating (at peak)', minValue: 0, maxValue: 55},
          legend: 'none'          
        };
        var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 1000px; height: 1000px;"></div>
  </body>
</html>
4

2 回答 2

2

这里的问题是 {v: value, f: 'formatted value'} 语法不适用于 arrayToDataTable 方法（如此处所述（https://developers.google.com/chart/interactive/docs/reference #google.visualization.arraytodatatable））。如果要使用该语法，则必须手动定义 DataTable，然后使用 #addRows 方法

于 2013-07-24T16:49:11.133 回答
1

不知道为什么我有这个错误，但我找到了解决它的方法。当我使用 DataTable 构造函数时它开始工作：

var data = new google.visualization.DataTable();
                data.addColumn('number', 'Price');
                data.addColumn('number', 'Canon');
                data.addColumn('number', 'Nikon');
                data.addColumn('number', 'Other');
                data.addRows([
                  [{v:6000, f: 'Canon EOS-1Ds Mark III'}, 60  ,null  ,null],
                  [{v:5000, f: 'Canon EOS-1Ds Mark II'}, 50  ,null  ,null],

而不是 arraytoDataTable 构造函数：

   var data = google.visualization.arrayToDataTable([
      ['Camera','Avg Rating'],
      [ {v:6000, f: 'Canon EOS-1Ds Mark III'}, 60],
      [ {v:5000, f: 'Canon EOS-1Ds Mark II'}, 50],
      [ {v:4000, f: 'Canon EOS-1D Mark IV'}, 40]
    ]);

希望对遇到此问题的任何人有所帮助。

于 2012-12-26T20:32:35.727 回答