Question

以下是我从csv数据创建Google图表的代码。也没有错误。但即使图表也没有出现。

以下是有效的文档：http://economistry.com/2013/07/easy-data-visualization-with-google-charts-and-a-csv/

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script src="http://jquery-csv.googlecode.com/files/jquery.csv-0.71.js"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);

    function drawChart() {
       // grab the CSV
       $.get("Chart1-data.csv", function(csvString) {
          // transform the CSV string into a 2-dimensional array
          var arrayData = $.csv.toArrays(csvString, {onParseValue: $.csv.hooks.castToScalar});
        alert(arrayData);
          // this new DataTable object holds all the data
          var data = new google.visualization.arrayToDataTable(arrayData);

          // this view can select a subset of the data at a time
          var view = new google.visualization.DataView(data);
          view.setColumns([0,1]);

         // set chart options
         var options = {
        title: "A Chart from a CSV!",
        hAxis: {title: data.getColumnLabel(0), minValue: data.getColumnRange(0).min, maxValue: data.getColumnRange(0).max},
        vAxis: {title: data.getColumnLabel(1), minValue: data.getColumnRange(1).min, maxValue: data.getColumnRange(1).max},
        legend: 'none'
         };

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

Chart1-data.csv

Category,

A,34

B,23

C,14

D,57

E,18    

Other,5

我是否遗漏了代码中的任何内容？

Answer 1

好消息：你的守则没问题！您的CSV文件是瓶颈。

列名不能为null，表示Category，=＆gt;类别 ''
数据行之间没有其他换行符，表示

A，34

B，23

=＆GT;

A，34
B，23

结果：

Category,''
A,34
B,23
C,14
D,57
E,18
Other,5

就是这样！：）

Answer 2

此Google图表代码段似乎没有任何问题。

虽然在浏览器控制台中存在一些未捕获的JavaScript错误。最重要的是有 “未捕获空”错误，该错误在“类别”之后引用空格，因此类别，“应该可以正常工作

即使没有错误，也不会显示Google图表

2 个答案: