2016-05-12 71 views
0

我想顯示其中一張圖表,但現在只顯示第一張圖表,而我似乎無法在其底部顯示其他圖表。另外,如何讓圖表與中間對齊?如何放置圖表頂部和底部?

<section> 
    <html> 
    <div class="container"></div> 

    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 

    <div id="columnchart_values" style="width: 1200px; height: 700px;"></div> 
     <script type="text/javascript"> 
     google.charts.load("current", {packages:['corechart']}); 
     google.charts.setOnLoadCallback(drawChart); 
     function drawChart() { 
      var data = google.visualization.arrayToDataTable([ 
      ["Week", "# of F2F=0"], 
      ["Copper", 8.94], 
      ["Silver", 10.49], 
      ["Gold", 19.30], 
      ["Platinum", 0] 
      ]); 

      var view = new google.visualization.DataView(data); 
      var options = { 
      title: "Period: ASEAN 2Q F2F = 0 Dashboard", 
      'backgroundColor': 'transparent', 
      width: 600, 
      height: 400, 
      bar: {groupWidth: "70%"}, 
      legend: { position: "right" }, 
      }; 
      var chart = new google.visualization.ColumnChart(document.getElementById("columnchart_values")); 
      chart.draw(view, options); 
     } 
     </script> 

    <div id="piechart_3d" style="width: 1200px; height: 700px;"></div> 
     <script type="text/javascript"> 
      google.charts.load("current", {packages:["corechart"]}); 
      google.charts.setOnLoadCallback(drawChart); 
      function drawChart() { 
      var data = google.visualization.arrayToDataTable([ 
       ['Number of calls made', 'Number of people'], 
       ['F2F = 0', 6], 
       ['1 < F2F < 5', 8], 
       ['F2F > 9', 5] 
      ]); 

      var options = { 
       title: 'Period: ASEAN2QWK3', 
       titleTextStyle: { 
       fontSize: 21 
       }, 
       'backgroundColor': 'transparent', 
       is3D: true, 
      }; 

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

    </html> 
    </section> 

回答

0

您正在調用'.load'方法兩次,這是不正確的。

只需在第二個圖表的下方註釋,兩個圖表都將被加載。

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