Question

我正在使用JSON使用Google图表库绘制多个图表。所以我动态地调用该函数。这是我的代码：我该如何发挥作用

$.getJSON(destination, params = null, function(data){
  $.each(data, function(chartName, chartData){
    window[chartName](chartData);
  });
});

以动态方式显示的功能示例

function drawme(){
// prepare the chart data
var data = new google.visualization.DataTable();
data.addColumn('string','Browser');
data.addColumn('number','range');
data.addRows([
        ["Javascript",10],
        ["Images",30],
        ["HTML",20],
        ["CSS",30],
        ["Other",10]
]);
var options = {"pieHole":0.4, "width":100, "height":100,'legend':'none', 'chartArea': {'width': '80%', 'height': '80%'}};
// draw the chart
var chart = new google.visualization.PieChart(document.getElementById("pageSpeed"));
chart.draw(data, options);
}

我的PHP代码：

<?php
  echo json_encode(array('drawme'=> array()));
 ?>

我没事了，我的问题是我该如何避免此行：google.charts.setOnLoadCallback(drawme); 有没有办法动态地

谢谢

Answer 1

google.charts.setOnLoadCallback仅需要在每次加载页面时调用一次，
然后您可以根据需要绘制任意数量的图表。

您还可以使用load语句返回的promise。

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

此外，load语句将默认等待页面加载。
这样，您可以使用google.charts.load代替$(document).ready

我建议您先加载google，然后再进行加载，
然后加载json并绘制您需要的所有图表...

类似于以下设置...

google.charts.load('current', {
  packages: ['corechart']
}).then(function () {
  $.getJSON(destination, params = null, function(data){
    $.each(data, function(chartName, chartData){
      drawChart(chartName, chartData);
    });
  });
});

有什么办法可以避免谷歌图表中继器

1 个答案: