如何在運行時使用php和ajax生成Fusion Charts？

當用戶從組合框中選擇表名時，我需要在頁面中生成融合圖表。基於組合框的值，必須在同一頁面上生成圖表，同時選擇組合框中的值。但是當我點擊組合框中的值時，輸出結果是「圖表」。圖表不顯示。如何在運行時使用php和ajax生成Fusion Charts？

以下是我已經試過代碼：

編碼tp.html

<html> 
<head> 

<script> 
function showUser(str) 
{ 
if (str=="") 
    { 
    document.getElementById("chartContainer").innerHTML=""; 
    return; 
    } 
if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    {// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("chartContainer").innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("POST","getchart1.php?q="+str,true); 
xmlhttp.send(); 
} 
</script> 
</head> 
<body> 

<form> 
<select name="users" onchange="showUser(this.value)"> 
<option value="">Select a person:</option> 
<option value="growth1">growth1</option> 

</select> 
</form> 
<br> 
<div id="chartContainer"><b>chart will be shown here</b></div> 

</body> 
</html>

編碼getchart1.php

<?php 
echo'<script type="text/javascript" src="Charts/FusionCharts.js"></script>'; 
echo'<script type="text/javascript" src="Charts/prototype.js"></script>'; 
// Include the DBConn.php and FusionCharts.php files, so that we can access their variables and functions. 
include('Includes/DBConn.php'); 
include('Includes/FusionCharts.php'); 

$q =mysql_escape_string($_GET["q"]); 
$con = mysql_connect("localhost","root",""); 
if (!$con) 
    { 
    die('Could not connect: ' . mysql_error()); 
    } 

mysql_select_db("chart", $con); 


?> 

<?php 
// Use the connectToDB() function provided in DBConn.php, and establish the connection between PHP and the World database in our MySQL setup. 
$link = connectToDB(); 

// Form the SQL query which will return the Top 10 Most Populous Countries. 
$strQuery = "SELECT * FROM $q"; 

// Execute the query, or else return the error message. 
$result1 = mysql_query($strQuery) or die(mysql_error()); 

// If we get a valid response - 
if ($result1) { 

    // Create the chart's XML string. We can add attributes here to customize our chart. 
    $strXML = "<chart caption='CHENNAI-GROWTH YEAR WISE' showValues='0' useRoundEdges='1' palette='3'>"; 

    while($ors = mysql_fetch_array($result1)) { 

     // Append the names of the countries and their respective populations to the chart's XML string. 
     $strXML .= "<set label='".$ors['year']."' value='".$ors['tnos']."' link='F-detailsFrame2-../register/drill1.php?id=".$ors['year']."' />"; 
    } 
} 
// Close the chart's XML string. 
$strXML .= "</chart>"; 











      // Set the rendering mode to JavaScript 
      echo FC_SetRenderer('javascript'); 

      // Call the renderChart method, which would return the HTML and JavaScript required to generate the chart 
      echo renderChart('Charts/Column2D.swf', // Path to chart type 
        '',  // Empty string when using Data String method 
        $strXML,// Variable which has the chart data 
        'chartdiv', // Unique chart ID 
        '660', '400', // Width and height in pixels 
        false, // Disable debug mode 
        true // Enable 'Register with JavaScript' (Recommended) 
       ); 


    mysql_close($con); 
?>

來源

2014-03-02 user3304531

首先，請注意同時使用「FusionCharts.php」包裝來調用「renderChart（）」PHP樂趣來生成圖表它在內部生成必要的JavaScript代碼段（如您所見，here）和一個DIV容器，它在這裏呈現圖表。

現在，在您的代碼中，您正在對選擇該選項進行xmlhttp請求，該選項實際上將DML「chartContainer」中的HTML + JavaScript代碼（在請求的PHP頁面中生成）編寫爲文本，並且不會執行JavaScript生成圖表SVG流來繪製圖表的代碼。

因此，您可以簡單地在PHP文件中生成XML字符串（基於POST參數），然後發送回「tp.html」頁面，您可以在其中呈現圖像使用XML數據的圖表作爲http響應來滿足您的要求。

來源

2014-03-03 07:17:03 Sashibhusan

謝謝你的迴應..我真的不知道阿賈克斯和這些xmlhhtp請求..你可以實際發佈的代碼與你認爲的變化..請。 – user3304531

如何在運行時使用php和ajax生成Fusion Charts？

回答

相關問題