Question

当用户从组合框中选择表名时，我需要在页面中生成融合图表。基于组合框的值，必须在同一页面上生成图表，同时在组合框中选择值。但是当我点击组合框中的值时，输出就会变成“图表”。图表未显示。

以下是我尝试过的代码：

编码 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);
 ?>

Answer 1

首先，请注意，使用“FusionCharts.php”包装器通过调用“renderChart（）”PHP函数生成图表时，在内部生成必要的JavaScript代码片段（如您所见here）和一个DIV容器，在那里呈现图表。

现在，在您的代码中，您正在选择选项时发出xmlhttp请求，该选项实际上将HTML + JavaScript代码（在请求的PHP页面中生成）作为文本写入DIV“chartContainer”中，并且不会执行JavaScript代码生成图表SVG流以绘制图形。

因此，您不必尝试在PHP文件中呈现图表，而只需在PHP文件中生成XML字符串（基于POST参数）并发送回“tp.html”页面，您可以在其中呈现使用XML数据的图表作为http响应，以满足您的要求。

如何使用php和ajax在运行时生成Fusion图表？

1 个答案: