谷歌图表只显示每

页

我有两个排行榜我想显示一个图表，但由于某些原因，它只能显示第一个谷歌图表只显示每

它只显示sarahChart如果我交换的功能的顺序是只有将显示anthonyChart

这里是我的脚本：

<script type="text/javascript"> 

    google.load('visualization', '1.0', {'packages':['corechart']}); 

    google.setOnLoadCallback(drawSarahChart); 

    google.setOnLoadCallback(drawAnthonyChart); 

    function drawSarahChart() { 

     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'Emplacement'); 
     data.addColumn('number', 'Quantité'); 
     data.addRows(<?php echo "[\n"; 
      echo $prefix . " [\n"; 
      echo ' "Stock",' . "\n"; 
      echo $count_stock . '' . "\n"; 
      echo " ]"; 
      $prefix = ",\n"; 
      echo $prefix . " [\n"; 
      echo ' "Maintenance",' . "\n"; 
      echo $count_maint . '' . "\n"; 
      echo " ]"; 
      $prefix = ",\n"; 
      foreach ($combined_depart as $key => $value) { 
       echo $prefix . " [\n"; 
       echo ' "' . $key . '",' . "\n"; 
       echo $value . '' . "\n"; 
       echo " ]"; 
       $prefix = ",\n"; 
     } 
     echo "\n]";?>); 

     var options = {title:'Nombre de materiel par emplacement', 
            width:600, 
            height:500}; 

     var chart = new google.visualization.PieChart(document.getElementById('Sarah_chart_div')); 
     chart.draw(data, options); 
    } 

    function drawAnthonyChart() { 

     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'type'); 
     data.addColumn('number', 'quantité'); 
     data.addRows(<?php echo "[\n"; 
      foreach ($combined as $key => $value) { 
       echo $prefix . " [\n"; 
       echo ' "' . $key . '",' . "\n"; 
       echo $value . '' . "\n"; 
       echo " ]"; 
       $prefix = ",\n"; 
     } 
     echo "\n]"; ?>); 

     var options = { 
      title: "Nombre de materiel par type", 
      width: 400, 
      height: 300 
     }; 

     var chart = new google.visualization.BarChart(document.getElementById('Anthony_chart_div')); 
     chart.draw(data, options); 
    } 

</script>

这里是HTML：

<table class="columns"> 
    <tr> 
    <td><div id="Sarah_chart_div"></div></td> 
      <td><div id="Anthony_chart_div"></div></td> 
    </tr> 
</table>

通过，如果我把

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

    google.charts.setOnLoadCallback(drawSarahChart); 

    google.charts.setOnLoadCallback(drawAnthonyChart);

在开始，而不是那道，也不图表的显示控制台显示以下错误：

无法读取的不确定

财产“负荷”

如果我只更换2行

google.charts.setOnLoadCallback(drawSarahChart); 

    google.charts.setOnLoadCallback(drawAnthonyChart);

既不再次显示，控制台显示以下错误：

无法读取属性“setOnLoadCallback”的未定义

请帮忙，谢谢！

来源

2016-07-28 Meryem

第一setOnLoadCallback只应每页

调用一次，但你可以包括callback直接在load声明

试试这样...

google.load('visualization', '1.0', { 
    callback: function() { 
    drawSarahChart(); 
    drawAnthonyChart(); 
    }, 
    packages: ['corechart'] 
});

来源

2016-07-28 14:59:21 WhiteHat

它不显示任何内容或者不幸。 – Meryem

在控制台中的任何错误？ – WhiteHat

对不起，我错了，它只显示其中一个图表，并且错误显示为给出的每一行都必须为null或数组。 – Meryem

其实你试图使用相同的回调两次。取而代之的是，你可以定义一个回调函数，其中包括你的两个子功能drawSarahChart和drawAnthonyChart

google.charts.setOnLoadCallback(function(){ 
    drawSarahChart(); 
    drawAnthonyChart(); 
});

来源

2016-07-28 14:36:18

时，我想这也表明既无与错误无法读取的不确定财产“setOnLoadCallback”的图表，当我删除.charts但依然有只有一个 – Meryem

你能分享的jsfiddle其中包括您的最终代码？ –

我更正了错字。谢谢@WhiteHat –

谷歌图表只显示每

回答

相关问题