Uncaught (in promise) Error: Data for arrayToDataTable is not an array in visualizing data using https://www.google.com/jsapi

Question

我正在尝试可视化 javascript 文件中的数据，如下所示。

data = [ ['Year','China','India'],
['C1960',1.83286768126466,1.96098348563911],
['C1961',-1.01552778731319,1.99843774000741],
['C1962',0.820455548748518,2.03190545392019],
.
.
.
['C1963',2.45764740395145,2.0569116837358],
['C2017',0.559121331017265,1.06259739387194],
['C2018',0.455899678672578,1.03732336037888],
['C2019',0,0]
];

我使用的html代码如下。

<html>
  <head>
    <script type="text/javascript" src="data.js"></script>
    <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( data );

        var options = {
          title: 'World Bank Data Visualization',
          chartArea: {left:'10%',top:'10%', width: '65%', height: '65%'}
        };

        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 1300px; height: 600px;"></div>
  </body>
</html>

我收到错误

Uncaught (in promise) Error: Data for arrayToDataTable is not an array.
    at Object.gvjs_ll [as arrayToDataTable] (jsapi_compiled_default_module.js:188)
    at drawChart (data.htm:9)

有人可以帮我吗？当我像这样加载另一个 javascript 文件时，它完美地工作。我不知道我的代码有什么问题。

Answer 1

在您的 html 中，您有一个名为 data 的变量。因此，来自 data.js 的变量 data 被隐藏了。有关可变阴影的更多详细信息 here。

要使您的代码正常工作，请将该变量名称更改为其他名称。

类似于：

google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
  var dataVis = google.visualization.arrayToDataTable( data );

  var options = {
       title: 'World Bank Data Visualization',
       chartArea: {left:'10%',top:'10%', width: '65%', height: '65%'}
  };

  var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
  chart.draw(dataVis, options);
}

Uncaught (in promise) Error: Data for arrayToDataTable is not an array in visualizing data using https://www.google.com/jsapi

Uncaught (in promise) Error: Data for arrayToDataTable is not an array in visualizing data using https://www.google.com/jsapi

html

javascript

data-visualization

google-api-javascript-client