我正在使用谷歌图表,我需要从PHP文件(或HTML文件中的PHP?)中获取数据,以将数据提供给图表。那么我该怎么做呢,并确保在绘制图表之前抓取数据。 我已经去了解如何使用PHP从Mysql数据库中获取数据
这是我需要将代码放入
的代码<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load('visualization', '1.0', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
// Callback that creates and populates a data table,
// instantiates the pie chart, passes in the data and
// draws it.
function drawChart() {
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Color');
data.addColumn('number', 'Votees ');
data.addRows([
['Value from Mysql', 3000],
['Value2 from Mysql', 13000],
]);
// Set chart options
var options = {'title':'Table Name From MySql',
'width':600,
'height':450};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<!--Div that will hold the pie chart-->
<div id="chart_div"></div>
</body>
</html>
答案 0 :(得分:1)
HTML中没有变量 - 我认为你的意思是你希望能够将PHP值与你用于Google图表的代码一起使用。我没有使用Goggle图表的经验,但是from what I can see它使用了一些JavaScript API。也许您正在寻找的是一种将您的值变为JavaScript变量的方法,以便您在处理图表插件时可以使用它们。
这正是PHP的用途 - 采用静态静态内容和嵌入脚本为其提供动态内容。
例如,您可以让PHP初始化一个JavaScript变量 -
<?php
$some_php_var = 'overflow';
?>
<script type="text/javascript">
var stack = '<?php echo $some_php_var; ?>';
</script>
现在您将拥有一个名为stack
的JavaScript变量,其值将为“溢出”。
可以在任何地方使用相同的技术 - 即使在变量定义的中间。让我们以您的代码为例 -
// Set chart options
var options = {
'title':'<?php echo $dbResult['Table Name'] ?>',
'width':600,
'height':450
};
...
data.addRows([
['<?php echo $dbResult['value1']; ?>', 3000],
['<?php echo $dbResult['value2']; ?>', 13000],
]);
答案 1 :(得分:1)
您可以像这样从PHP插入值:
<?php echo $myVariableName; ?>
答案 2 :(得分:0)
最简单的例子:在PHP文件中,如index.php
<!DOCTYPE>
<html>
<head>
<meta charset="UTF-8" />
</head>
<body>
<?php
echo $the_data_as_a_string;
?>
</body>
更好的方法是实际打开一个text / plain类型的脚本标记并将数据转储到那里。
<!DOCTYPE>
<html>
<head>
<meta charset="UTF-8" />
</head>
<body>
<script id="the-data" type="text/html" ><?php echo $the_data_as_a_string; ?></script>
<script type="text/javascript" >
var data = document.getElementById('the-data').innerHTML;
</script>
</body>
顶级脚本标签不会被浏览器执行,但是底层标签仍然可以作为字符串访问它的内容,并用它做任何需要。
编辑:
优点是您可以安全地编写.js文件并将它们包含为静态文件,因此它们将被浏览器缓存。
此外,您可以包含一个数据脚本,这样即使html将是静态的=每次都没有更改=浏览器缓存。
请注意,这只是一个懒人对数据的ajax请求,您应该考虑这一点。 :)