php - 谷歌组合图问题

Question

我正在尝试使用谷歌图表创建组合图表，在 CDN 和 div 下方添加的 HTML 中

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div" style="width: auto; height: 500px;"></div>

结果

var examname = <?php echo json_encode($examnames); ?>;
var highestScore = <?php echo json_encode($heighestScores); ?>;
var userScore = <?php echo json_encode($userScores); ?>;

是

var examname = ["Test Name 1", "Full Test", "Knowledge"]; 
var highestScore = ["8", "11", "10"];
var userScore = ["6", "11"];



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

      function drawVisualization() {
        // Some raw data (not necessarily accurate)
        var graphData = new google.visualization.DataTable();
        graphData.addColumn('string', 'TestName');
        graphData.addColumn('number', 'Height');
        graphData.addColumn('number', 'YourScore');

        for (var i = 0; i < examname.length; i++) {
          if (userScore[i] === undefined) {
            userScore[i] = 0;
          }
          console.log(userScore[i]);
          graphData.addRow(examname[i], {
            v: highestScore[i],
            f: userScore[i]
          });
        }
        //graphData = graphData.replace(/'/g, '"');
        //var data = google.visualization.arrayToDataTable(graphData);
        console.log(data);
        var options = {
          title: 'Score Dashboard',
          vAxis: {
            title: 'Score'
          },
          hAxis: {
            title: 'Exam Name'
          },
          seriesType: 'bars',
          series: {
            5: {
              type: 'line'
            }
          }
        };

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

JSFIDDLE

我收到一个错误:

Error: If argument is given to addRow, it must be an array, or null

即使我在谷歌搜索，但我不明白。请任何人帮助我解决问题。

Answer 1

你的传递(字符串，对象)。当它只期待(数组)时。

改变

graphData.addRow(examname[i], {
    v: highestScore[i],
    f: userScore[i]
});

给

graphData.addRow([
    examname[i],
    Number(highestScore[i]),
    Number(userScore[i])
]);

工作示例: https://jsfiddle.net/g4vjvam9/

注意:如果要填充最后一列，需要加上值:/

var userScore = ["6", "11", "2"];

还要避免使用字符串，否则您需要像上面那样使用 Number()。