如何将我的数据传递到谷歌图表API?

时间:2015-12-18 15:38:38

标签: javascript charts google-visualization

我无法使用google charts api将变量值传递给绘图功能的var数据部分。我的代码当前显示图表的标题,但没有实际的图表。如果我将我的数据更改为固定数字(1,2,3,4)而不是(h,i,j,k),那么我会得到完全符合我想要的图表。问题是图表的数据不固定。任何帮助都会很棒。

script type="text/javascript">
var h;
var i;
var j;
var k;

function myFunction() {
// h,i,j,k are calculated in here.   
};


  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  //i now reference h,i,j,k in the var data portion of the drawchart function
  function drawChart() {
    var data = google.visualization.arrayToDataTable([
      ['Task', 'Hours per Day'],
      ['P&I',     h],
      ['Tax',      i],
      ['Insurance',  j],
      ['MI', k]
    ],
    false);

    var options = {
      title: 'My Daily Activities',
      pieHole: 0.4,
    };

    var chart = new google.visualization.PieChart(document.getElementById('donutchart'));
    chart.draw(data, options);
  };
</script>

1 个答案:

答案 0 :(得分:0)

也许它与时间有关 你什么时候打电话给myFunction

这有效......

var h;
var i;
var j;
var k;

function myFunction() {
  // h,i,j,k are calculated in here.   
  h = 2;
  i = 4;
  j = 6;
  k = 8;
};


google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);

function drawChart() {
  
  // set var values
  myFunction();
  
  var data = google.visualization.arrayToDataTable([
    ['Task', 'Hours per Day'],
    ['P&I',        h],
    ['Tax',        i],
    ['Insurance',  j],
    ['MI',         k]
  ]);

  var options = {
    title: 'My Daily Activities',
    pieHole: 0.4,
  };

  var chart = new google.visualization.PieChart(document.getElementById('donutchart'));
  chart.draw(data, options);
};
<script src="https://www.google.com/jsapi"></script>
<div id="donutchart" style="height: 320px; width: 320px;"></div>