Question

我正在尝试使用谷歌图表创建一个组合图表，在HTML中添加了CDN和div

<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

我收到错误：

错误：如果给addRow赋值，则它必须是数组，或者为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()。

谷歌组合图表问题

1 个答案: