Question

请参阅我已经看过相关主题，但他们没有帮助。

我正在创建折线图，其格式与：https://developers.google.com/chart/interactive/docs/gallery/linechart#Example

完全相同

区别在于我使用的是csv数据，这是从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() {
       $.get("Chart3-data1.csv", function(csvString) {
          var arrayData = $.csv.toArrays(csvString, {onParseValue: $.csv.hooks.castToScalar});
          var data = new google.visualization.arrayToDataTable(arrayData);
         var options =
        {
                title: 'Company Performance'
         };
        var chart = new google.visualization.LineChart(document.getElementById('gauge'));
        chart.draw(data, options);
});
      }
    </script>
  </head>
  <body>
    <div id="gauge" style="width: 900px; height: 500px;"></div>
  </body>
</html>

csv数据采用以下形式：

"Date,Term,Segment,Visitor"
"2014/01/01,2014/01/01 - 2014/01/31,All visitors,2"
"2014/01/01,2014/01/01 - 2014/01/31,New user,0"
"2014/01/01,2014/01/01 - 2014/01/31,Mobile traffic,0"
"2014/01/02,2014/01/01 - 2014/01/31,All visitors,7"
"2014/01/02,2014/01/01 - 2014/01/31,New user,1"
"2014/01/02,2014/01/01 - 2014/01/31,Mobile traffic,0"
"2014/01/03,2014/01/01 - 2014/01/31,All visitors,5"
"2014/01/03,2014/01/01 - 2014/01/31,New user,0"
"2014/01/03,2014/01/01 - 2014/01/31,Mobile traffic,0"
"2014/01/04,2014/01/01 - 2014/01/31,All visitors,3"
"2014/01/04,2014/01/01 - 2014/01/31,New user,1"
"2014/01/04,2014/01/01 - 2014/01/31,Mobile traffic,0"

错误：

Not enough columns given to draw the requested chart

Answer 1

不要在CSV文件的每一行周围加上引号。在CSV中，当单个数据元素包含分隔符时，您可以在单个数据元素周围添加引号。允许包含逗号的值。所以你所写的内容使得每一行都是一个值，而不是4个值。

如果您无法更改输入数据，则可以在将其作为CSV处理之前从字符串中删除无关的引号：

csvstring = csvstring.replace(/^"|"$/gm, '');

CSV数据加载给出的列数不足以绘制所请求的图表

1 个答案: