最簡單的方法使用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的變量

回答

相關問題