首页 > 解决方案 > 绘制折线图中的动态数据问题

问题描述

我正在用下面给出的谷歌折线图制作折线图

google.charts.load('current', {
  'packages': ['line']
});
google.charts.setOnLoadCallback(drawLineChart);

function drawLineChart() {
  var data = new google.visualization.DataTable();
  data.addColumn('number', 'March');
  data.addColumn('number', '2020');
  data.addColumn('number', '2021');

  var date = new Date();
  var firstDay = new Date(date.getFullYear(), date.getMonth(), 1);
  var lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
  var rows = '';
  var rows_arr = [];
  
  $.ajax({
    url: "{{route('admin.geteachdaysales')}}",
    type: "get",
    success: function(res) {
      var i;

      for (i = 1; i <= lastDay.getDate(); i++) {
        if (i == lastDay.getDate()) {
          rows += '[' + parseInt(i) + ',' + (res.current_year_data[i]) + ',' + (res.prev_year_data[i]) + ']';
        } else {
          rows += '[' +
            parseInt(i) + ',' + (res.current_year_data[i]) + ',' + (res.prev_year_data[i]) + '],';
        }
        var row_obj = [i, res.current_year_data[i], res.prev_year_data[i]]
        rows_arr.push(row_obj);
      }
    }
  });
  data.addRows(rows_arr);
  //data.addRows(JSON.parse(rows_arr));

  var options = {
    chart: {
      title: 'Box Office Earnings in First Two Weeks of Opening',
      subtitle: 'in millions of dollars (USD)'
    },
    axes: {
      x: {
        0: {
          side: 'top'
        }
      }
    }
  };

  var chart = new google.charts.Line(document.getElementById('linechart_material'));
  chart.draw(data, google.charts.Line.convertOptions(options));
}
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>


<div id="linechart_material" style="height: 200px; width: 300px;"></div>

但问题是我安慰rows它显示的像[1,0,0],[2,0,0],[3,0,0],[4,0,0],[5,0,0],[6,0,0],[7,0,0],[8,0,0],[9,0,0],[10,0,0],[11,0,0],[12,0,0],[13,0,0],[14,0,0],[15,0,0],[16,0,0],[17,0,0],[18,2000,11000],[19,0,0],[20,0,0],[21,0,0],[22,0,0],[23,0,0],[24,0,0],[25,0,0],[26,0,0],[27,0,0],[28,0,0],[29,0,0],[30,0,0],[31,0,0]

当我在其中静态添加它时,data.addRows([[1,0,0],[2,0,0],[3,0,0],[4,0,0],[5,0,0],[6,0,0],[7,0,0],[8,0,0],[9,0,0],[10,0,0],[11,0,0],[12,0,0],[13,0,0],[14,0,0],[15,0,0],[16,0,0],[17,0,0],[18,2000,11000],[19,0,0],[20,0,0],[21,0,0],[22,0,0],[23,0,0],[24,0,0],[25,0,0],[26,0,0],[27,0,0],[28,0,0],[29,0,0],[30,0,0],[31,0,0]]); 它会正确显示图表,但是当添加它时,data.addRows([rows]);它会显示如下错误

未捕获(承诺中)错误:第 0 行不是空值或数组。

有人可以帮我吗?

标签: jqueryreact-google-charts

解决方案


推荐阅读