最简单的方法使用HTML中的PHP的变量

-1

我正在使用谷歌图表，我需要从PHP文件（或HTML文件内的php？）中获取数据以将数据提供给图表。那么，我将如何做到这一点，并确保在绘制图表之前获取数据。我已经去了，虽然搞清楚如何从MySQL数据库和PHP抓取数据最简单的方法使用HTML中的PHP的变量

这是我需要把瓦尔在

<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>

来源

2012-07-22 Keithsoulasa

自己先试一下 – 2012-07-22 19:30:23

如果你能给我们提供一些关于你如何实现这些图表的更多信息，我相信我们可以给你一个更具体的答案。帮助我们来帮助你;） – Lix 2012-07-22 19:39:45

有HTML中没有变量，这样的代码 - 我想你意思是你希望能够将PHP值与你用于Google图表的代码一起使用。我没有太多使用Goggle图表的经验，但使用了一些JavaScript API的from what I can see。也许你正在寻找的是一种将你的值加入JavaScript变量的方式，以便在处理你的图表插件时使用它们。

这正是PHP制作的内容 - 获取静态静态内容并嵌入脚本，为其提供动态内容。

例如，你可以有你的PHP初始化JavaScript变量 -

<?php 
    $some_php_var = 'overflow'; 
?> 

<script type="text/javascript"> 
    var stack = '<?php echo $some_php_var; ?>'; 
</script>

现在，你有一个JavaScript变量称为stack，其价值将是“溢出”。

同样的技术可以在任何地方被使用 - 即使是在变量定义的中间。让我们把你的代码为例 -

// 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], 
]);

来源

2012-07-22 19:35:18 Lix

最好的方法是不从PHP生成JavaScript代码 – Azder 2012-07-22 19:36:13

OP使用某种谷歌图表插件 - 我假设它是使用某种JavaScript API实现的，并且您将提供数据到它。生成JavaScript代码与简单地回显变量值不同。 – Lix 2012-07-22 19:38:28

不是。生成数据或JavaScript，或任何只是回应的东西。我已经为我的答案添加了第二个示例来演示它。 – Azder 2012-07-22 19:46:35

你从PHP插入值是这样的：

<?php echo $myVariableName; ?>

来源

2012-07-22 19:35:19 SteAp

最简单的例子：在一个PHP文件， like 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>

顶部script标签将不会被浏览器得到执行，但底部仍然可以访问它的内容作为一个字符串，并尽一切可能与需要。

编辑：

的好处是，你可以放心地写你的.js文件，并把它们作为静态的，因此它们将被浏览器缓存。

此外，您可以包含数据脚本，因此即使html将是静态的=每次不会更改=由浏览器缓存。

请注意，这只是lazyman对数据的ajax请求，您应该考虑这一点。 :)

来源

2012-07-22 19:35:20 Azder

但我怎么会在HTML文档中的其他地方使用该数据 – Keithsoulasa 2012-07-22 19:46:12

我从来没有见过这种方法 - 似乎与其他方法相比略长。你能给你的方法有什么优势吗？我了解可能出现的类似于[我]（http://facebook.stackoverflow.com/a/11603372/558021）的解决方案中的转义问题，但如果处理正确的服务器端，这些问题将变成非问题... – Lix 2012-07-22 19:48:02

您请确认Google会将原始文本数据编入索引... – Lix 2012-07-26 11:02:23

最简单的方法使用HTML中的PHP的变量

回答

相关问题