在两个Google饼图中,只有一个显示

时间:2019-05-20 13:36:03

标签: javascript php

在网页中加载两个饼图的问题。

我正在使用Laravel框架,并且试图在网页中显示两个饼图。但是只显示一个饼图。

<script type="text/javascript">
   var analytics = <?php echo $alliance; ?>;
   var analytics2 = <?php echo $partyname; ?>;
   google.charts.load('current', {'packages':['corechart']});
   google.charts.setOnLoadCallback(drawChart);
   function drawChart()
   {    
    var data = google.visualization.arrayToDataTable(analytics);
    var options = {
     title : 'Percentage of NDA & UPA',
     chartArea:{left:0,top:0,width:"75%",height:"75%"}
    };
    var chart = new 
google.visualization.PieChart(document.getElementById('chart_div'));
    chart.draw(data, options);    
    var data2 = google.visualization.arrayToDataTable(analytics2);
    var options2 = {
     title : 'Percentage by Partywise',
     chartArea:{right:0,top:0,width:"75%",height:"75%"}
    };
    var chart2 = new 
google.visualization.PieChart(document.getElementById('chart_div2'));
    chart.draw(data2, options2);
   }
</script>


</head>
 <body>
  @include('includes.topnav')
  @include('includes.bottomnav')  
  <div class="container">
    <h3 align="left">LokSabha Election 2014</h3><br />   
    <div class="panel panel-default">
      <div class="panel-heading">
          <h3 class="panel-title">Percentage of NDA and UPA</h3>
      </div>
      <div class="panel-body" align="left">
         <div id="chart_div" style="width:1800px; height:300px;"> </div>
      </div>
      </div>
      <div class="panel-body" align="right">
         <div id="chart_div2" style="width:1800px; height:300px;"> </div>
      </div>
    </div>
  </div>
</body>
</html>

我想将两个饼图放在一个页面中。

1 个答案:

答案 0 :(得分:1)

我认为您曾两次致电chart.draw。请使用chart.draw和chart2.draw

var chart = new  google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);    
var data2 = google.visualization.arrayToDataTable(analytics2);
var options2 = {
 title : 'Percentage by Partywise',
 chartArea:{right:0,top:0,width:"75%",height:"75%"}
};
    var chart2 = new 
google.visualization.PieChart(document.getElementById('chart_div2'));
    chart2.draw(data2, options2);
   }