使用基本的Google Chart php/mysql/javascript/html设置,其中php用于从mysql检索数据,javascript设置图表,然后html和div在html中拉取图表。
但我想根据用户输入更改数据源。所以我想我会使用通过 url 发送的 php 变量。
我想我会监视“dbconnect.php”文件中的变量,该文件包含在使用 $_GET['var'] 检索 mysql 数据的 php 文件中,以根据发送的变量更改数据源url 例如 php?var (使用 switch 语句)。这工作正常,我可以看到 var 在 url 中发送并带有 echo。
但是,我期望 javascript url: "getDataUsers.php"部分将运行 getDataUsers.php 文件,以根据 url 传递的变量从不同的数据源获取数据。但实际上什么也没有发生。
我错过了什么?谢谢。
我的index.php文件:
<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript">
//added javascript variable for site from php url
**var vsite = "<?php echo $_GET['site']; ?>";**
// 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(drawChartUsers);
function drawChartUsers() {
var jsonDataUsers = $.ajax({
url: "getDataUsers.php",
dataType:"json",
async: false**,
//added data value for site from js variable vsite
data: {site: vsite }**
}).responseText;
// Create our data table out of JSON data loaded from server.
var dataUsers = new google.visualization.DataTable(jsonDataUsers);
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.ColumnChart(document.getElementById('users_chart_div'));
chart.draw(dataUsers, {
title:'# New Registered Users',
width: 1000,
height: 300,
legend : 'none',
vAxis:{title:'# users',textStyle:{color: '#005500',fontSize: '10', paddingRight: '100',marginRight: '100'}},
hAxis: { title: 'Date', textStyle: { color: '#005500', fontSize: '10', paddingRight: '100', marginRight: '100'} }});
}
</script>
</head>
<body>
<p>
<a href="index.php?site=a">a</a>-<a href="get_details.php?site=a">details a</a></br>
<a href="index.php?site=b">b</a>-<a href="get_details.php?site=b">details b</a></br>
<a href="index.php?site=c">c</a>-<a href="get_details.php?site=c">details c</a></br>
<a href="index.php?site=d">d</a>-<a href="get_details.php?site=d">details d</a></br>
</p>
<!--Div that will hold the charts-->
<div id="users_chart_div"></div>
</body>
</html>
我的 dbconnect.php 文件:
<?php
$site = $_GET['site'];
//echo "<p>I connected. The variable is: " . $site . "</p>";
switch ($site)
{
case 'a':
$server = 'server.com';
$username='a';
$password='a';
$database='a';
break;
case 'b':
$server = 'server.com';
$username='b';
$password='b';
$database='b';
break;
case 'c':
$server = 'server.com';
$username='c';
$password='c';
$database='c';
break;
case 'd':
$server = 'server.com';
$username='d';
$password='d';
$database='d';
break;
default:
echo "No database selected";
}
mysql_connect($server,$username,$password);
@mysql_select_db($database) or die( 'Unable to select database');
php?>
我的“getDataUsers.php”文件:
<?php
include 'dbconnect.php';
$query =mysql_query("SELECT
YEAR(created) AS Created_Year,
MONTH(created) AS Created_Month,
DAY(created) AS Created_Day,
count(id) AS NumUsers
FROM users
Group by
YEAR(created),
MONTH(created),
DAY(created)
ORDER BY
YEAR(created) ASC,
MONTH(created) ASC,
DAY(created) ASC");
$table = array();
$table['cols'] = array(
/* define your DataTable columns here
* each column gets its own array
* syntax of the arrays is:
* label => column label
* type => data type of column (string, number, date, datetime, boolean)
*/
array('label' => 'Date', 'type' => 'string'),
array('label' => '# Users', 'type' => 'number')
);
$rows = array();
while($r = mysql_fetch_assoc($query)) {
$temp = array();
// each column needs to have data inserted via the $temp array
$temp[] = array('v' => $r['Created_Year'] . '-' . $r['Created_Month']. '-' . $r['Created_Day']);
$temp[] = array('v' => (int) $r['NumUsers']);
// insert the temp array into $rows
$rows[] = array('c' => $temp);
}
// populate the table with rows of data
$table['rows'] = $rows;
// encode the table as JSON
$jsonTable = json_encode($table);
// set up header; first two prevent IE from caching queries
header('Cache-Control: no-cache, must-revalidate');
header('Content-type: application/json');
// return the JSON data
echo $jsonTable;
?>
最佳答案
您没有通过 AJAX 调用传递任何数据。您需要设置 AJAX 调用的 data
参数以包含 site
参数:
var jsonDataUsers = $.ajax({
url: "getDataUsers.php",
dataType:"json",
async: false,
data: {
site: 'a' // set the site parameter here as appropriate
}
}).responseText;
关于php - Google Chart - 如何使用 php 变量来更改数据源,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20865287/