谷歌餅圖不在yii

Question

在我的Yii網絡應用程序中，谷歌圖表不起作用。我通過renderpartial方法獲取所有值。但是，餅圖不顯示。

我的代碼，

<div class="content"> 
<div id="graph" style="width:300px;height:300px "> 
</div> 
</div> 
<script type="text/javascript" src="https://www.google.com/jsapi"> 
    // Load the Visualization API and the piechart package. 
google.load("visualization", "1", { packages: ["corechart"] }); 
    // Set a callback to run when the Google Visualization API is loaded. 
google.setOnLoadCallback(createPIE); 
    // Callback that creates and populates a data table, 
    // instantiates the pie chart, passes in the data and 
    // draws it. 
function createPIE() { 

    var options = { 
     title: 'Fees Allocation', 
     colors: ['#888', 'orange','red'], 
     is3D: true 
    }; 
    // Create our data table. 
var data = google.visualization.arrayToDataTable([ 

['Total Amount', <?php echo $amount;?>], 
['Collected', <?php echo $collected;?>], 
['Due', <?php echo $due;?>]]); 
var chart = new  google.visualization.PieChart(document.getElementById('graph')); 
      chart.draw(data, options); 

} 

</script> 

請幫助我。

Answer 1

有在你的代碼一些錯誤請嘗試以下代碼

<?php 
$amount = 20; 
$collected = 50; 
$due = 30; 
?> 

<div class="content"> 
<div id="graph" style="width:300px;height:300px"> 
</div> 
</div> 
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
<script type="text/javascript"> 
    // Load the Visualization API and the piechart package. 
google.charts.load("current", { packages: ["corechart"] }); 
    // Set a callback to run when the Google Visualization API is loaded. 
google.charts.setOnLoadCallback(createPIE); 
    // Callback that creates and populates a data table, 
    // instantiates the pie chart, passes in the data and 
    // draws it. 
function createPIE() { 

    var options = { 
     title: 'Fees Allocation', 
     colors: ['#888', 'orange','red'], 
     is3D: true 
    }; 
    // Create our data table. 
var data = google.visualization.arrayToDataTable([ 
['status', 'Amount'], 
['Total Amount', <?php echo $amount;?>], 
['Collected', <?php echo $collected;?>], 
['Due', <?php echo $due;?>]]); 
var chart = new  google.visualization.PieChart(document.getElementById('graph')); 
chart.draw(data, options); 

} 
</script> 

結帳此琴：https://jsfiddle.net/xoevL26z/