【问题标题】:Google combo chart issue谷歌组合图表问题
【发布时间】:2017-12-08 08:23:48
【问题描述】:

我正在尝试使用谷歌图表创建一个组合图表, 在 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

我收到一个错误:

错误:如果给addRow参数,它必须是一个数组,或者为null

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

【问题讨论】:

  • 嗯...错误消息不是告诉您确切的问题是什么吗?您将数组的元素而不是数组作为参数传递给 graphData.addRow。

标签: php jquery mysql html google-visualization


【解决方案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(),如上所示。

【讨论】:

  • np,很高兴为您提供帮助。
  • 动画不工作,更新fiddle
  • 所有这些选项都需要博士学位;p
  • 哈哈哈 :D 需要博士学位。实际上我第一次使用谷歌图表。如果您不介意,请您也帮我解决更多问题。
  • 在遇到困难后打开一个新问题。它允许其他人参与行动;p
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-09-12
  • 2011-03-06
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多