PHP MySQL Google Chart JSON - 完整范例
使用 MySQL 資料表資料作為資料來源來產生 Google Chart，我找了很多范例。我找了幾天，發(fā)現(xiàn)網(wǎng)路上很少有使用 PHP 和 MySQL 的范例來產生 Google Chart (圓餅圖、長條圖、直條圖、表格)。我最后終于找到一個范例可以執(zhí)行。
我之前已經從 StackOverflow 獲得了很多幫助，所以我這次也要回饋。
我有兩個范例，一個使用 Ajax 一個則沒有。今天，我只會展示非 Ajax 的范例。
使用方式：
- 需求：PHP、Apache 及MySQL
-
安裝：
- 使用phpMyAdmin 建立一個資料庫，并將其命名為"chart"
- 使用phpMyAdmin 建立一個表格，并將其命名為"googlechart"，并確保它只有兩欄，因為我使用了兩欄。不過，如果你想用更多欄，也可以按照指示對程式碼做些微的修改
- 指定欄位名稱如下："weekly_task" 和"percentage"
- 在表格中插入一些資料，欄位"_percentage_" 中只能使用數(shù)字
PHP-MySQL-JSON-Google Chart 的范例：
<?php
$con=mysql_connect("localhost","Username","Password") or die("Failed to connect with database!!!!");
mysql_select_db("資料庫名稱", $con);
// Google Chart 表格包含兩個欄位，分別是 weekly_task 和 percentage
// 這個範例將顯示一個圓餅圖，如果你需要其他的圖表例如長條圖，你必須對程式碼做一些微幅的調整，才能與長條圖或其他圖表搭配
$sth = mysql_query("SELECT * FROM chart");
/*
---------------------------
範例資料：表格 (Chart)
--------------------------
weekly_task percentage
Sleep 30
Watching Movie 40
work 44
*/
// flag 不需要
$flag = true;
$table = array();
$table['cols'] = array(
// 圖表的標籤，代表欄位標題
// 注意，一個欄位使用 "string" 格式，另一個使用 "number" 格式，因為圓餅圖只使用 "數(shù)字" 來計算百分比，字串則用於欄位標題
array('label' => 'Weekly Task', 'type' => 'string'),
array('label' => 'Percentage', 'type' => 'number')
);
$rows = array();
while($r = mysql_fetch_assoc($sth)) {
$temp = array();
// 下列程式碼用於分割圓餅圖
$temp[] = array('v' => (string) $r['Weekly_task']);
// 每一個分塊的值
$temp[] = array('v' => (int) $r['percentage']);
$rows[] = array('c' => $temp);
}
$table['rows'] = $rows;
$jsonTable = json_encode($table);
//echo $jsonTable;
?>
<html>
<head>
<!--載入 Ajax API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
// 載入視覺化 API 及圓餅圖套件。
google.load('visualization', '1', {'packages':['corechart']});
// 設定一個 callback 在 Google Visualization API 載入時執(zhí)行。
google.setOnLoadCallback(drawChart);
function drawChart() {
// 從伺服器載入的 JSON 資料中，建立我們的資料表格。
var data = new google.visualization.DataTable(<?=$jsonTable?>);
var options = {
title: '我的每週計畫',
is3D: 'true',
width: 800,
height: 600
};
// 使用部分選項，實例化並繪製我們的圖表。
// 別忘了檢查你的 div ID
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<!--這是會放置圓餅圖的 div-->
<div>PHP-PDO-JSON-MySQL-Google Chart 的范例：
<?php
/*
指令碼 : PHP-PDO-JSON-mysql-googlechart
作者 : Enam Hossain
版本 : 1.0
*/
/*
--------------------------------------------------------------------
使用方式：
--------------------------------------------------------------------
需求：PHP、Apache 及 MySQL
安裝：
--- 使用 phpMyAdmin 建立一個資料庫，並將其命名為 "chart"
--- 使用 phpMyAdmin 建立一個表格，並將其命名為 "googlechart"，並確保它只有兩欄，因為我使用了兩欄。不過，如果你想用更多欄，也可以按照指示對程式碼做些微的修改
--- 指定欄位名稱如下："weekly_task" 和 "percentage"
--- 在表格中插入一些資料
--- _percentage_ 欄位只能使用數(shù)字
---------------------------------
範例資料：表格 (googlechart)
---------------------------------
weekly_task percentage
----------- ----------
Sleep 30
Watching Movie 10
job 40
Exercise 20
*/
/* 資料庫名稱 */
$dbname = 'chart';
/* 資料庫使用者名稱與密碼 */
$username = 'root';
$password = '123456';
try {
/* 建立資料庫連線 */
$conn = new PDO("mysql:host=localhost;dbname=$dbname", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
/* 從 googlechart 表格中選出所有 weekly tasks */
$result = $conn->query('SELECT * FROM googlechart');
/*
---------------------------
範例資料：表格 (googlechart)
--------------------------
weekly_task percentage
Sleep 30
Watching Movie 10
job 40
Exercise 20
*/
$rows = array();
$table = array();
$table['cols'] = array(
// 圖表的標籤，代表欄位標題。
/*
注意，一個欄位使用 "string" 格式，另一個使用 "number" 格式，因為圓餅圖只使用 "數(shù)字" 來計算百分比，字串則用於分塊標題
*/
array('label' => 'Weekly Task', 'type' => 'string'),
array('label' => 'Percentage', 'type' => 'number')
);
/* 抽取 $result 中的資訊 */
foreach($result as $r) {
$temp = array();
// 下列程式碼用於分割圓餅圖
$temp[] = array('v' => (string) $r['weekly_task']);
// 每一個分塊的值
$temp[] = array('v' => (int) $r['percentage']);
$rows[] = array('c' => $temp);
}
$table['rows'] = $rows;
// 將資料轉換成 JSON 格式
$jsonTable = json_encode($table);
//echo $jsonTable;
} catch(PDOException $e) {
echo '錯誤：' . $e->getMessage();
}
?>
<html>
<head>
<!--載入 Ajax API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
// 載入視覺化 API 及圓餅圖套件。
google.load('visualization', '1', {'packages':['corechart']});
// 設定一個 callback 在 Google Visualization API 載入時執(zhí)行。
google.setOnLoadCallback(drawChart);
function drawChart() {
// 從伺服器載入的 JSON 資料中，建立我們的資料表格。
var data = new google.visualization.DataTable(<?=$jsonTable?>);
var options = {
title: '我的每週計畫',
is3D: 'true',
width: 800,以上是如何使用 PHP、MySQL 和 JSON 生成 Google 圖表（餅圖、條形圖、柱形圖和表格）？的詳細內容。更多信息請關注PHP中文網(wǎng)其他相關文章！
熱AI工具
Undress AI Tool
免費脫衣服圖片
Undresser.AI Undress
人工智能驅動的應用程序，用于創(chuàng)建逼真的裸體照片
AI Clothes Remover
用于從照片中去除衣服的在線人工智能工具。
Clothoff.io
AI脫衣機
Video Face Swap
使用我們完全免費的人工智能換臉工具輕松在任何視頻中換臉！
熱門文章
熱工具
記事本++7.3.1
好用且免費的代碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
功能強大的PHP集成開發(fā)環(huán)境
Dreamweaver CS6
視覺化網(wǎng)頁開發(fā)工具
SublimeText3 Mac版
神級代碼編輯軟件(SublimeText3)
如何在PHP中實施身份驗證和授權？
Jun 20, 2025 am 01:03 AM
tosecurelyhandleauthenticationandationallizationInphp，lofterTheSesteps：1.AlwaysHashPasswordSwithPassword_hash（）andverifyusingspasspassword_verify（），usepreparedStatatementStopreventsqlineptions，andStoreSeruserDatain usseruserDatain $ _sessiveferterlogin.2.implementrole-2.imaccessccsccccccccccccccccccccccccc.
如何在PHP中安全地處理文件上傳？
Jun 19, 2025 am 01:05 AM
要安全處理PHP中的文件上傳，核心在于驗證文件類型、重命名文件并限制權限。1.使用finfo_file()檢查真實MIME類型，僅允許特定類型如image/jpeg；2.用uniqid()生成隨機文件名，存儲至非Web根目錄；3.通過php.ini和HTML表單限制文件大小，設置目錄權限為0755；4.使用ClamAV掃描惡意軟件，增強安全性。這些步驟有效防止安全漏洞，確保文件上傳過程安全可靠。
PHP中==（松散比較）和===（嚴格的比較）之間有什么區(qū)別？
Jun 19, 2025 am 01:07 AM
在PHP中，==與===的主要區(qū)別在于類型檢查的嚴格程度。==在比較前會進行類型轉換，例如5=="5"返回true，而===要求值和類型都相同才會返回true，例如5==="5"返回false。使用場景上，===更安全應優(yōu)先使用，==僅在需要類型轉換時使用。
如何在PHP（ - ， *， /，％）中執(zhí)行算術操作？
Jun 19, 2025 pm 05:13 PM
PHP中使用基本數(shù)學運算的方法如下：1.加法用 號，支持整數(shù)和浮點數(shù)，也可用于變量，字符串數(shù)字會自動轉換但不推薦依賴；2.減法用-號，變量同理，類型轉換同樣適用；3.乘法用*號，適用于數(shù)字及類似字符串；4.除法用/號，需避免除以零，并注意結果可能是浮點數(shù)；5.取模用%號，可用于判斷奇偶數(shù)，處理負數(shù)時余數(shù)符號與被除數(shù)一致。正確使用這些運算符的關鍵在于確保數(shù)據(jù)類型清晰并處理好邊界情況。
如何與PHP的NOSQL數(shù)據(jù)庫（例如MongoDB，Redis）進行交互？
Jun 19, 2025 am 01:07 AM
是的，PHP可以通過特定擴展或庫與MongoDB和Redis等NoSQL數(shù)據(jù)庫交互。首先，使用MongoDBPHP驅動（通過PECL或Composer安裝）創(chuàng)建客戶端實例并操作數(shù)據(jù)庫及集合，支持插入、查詢、聚合等操作；其次，使用Predis庫或phpredis擴展連接Redis，執(zhí)行鍵值設置與獲取，推薦phpredis用于高性能場景，Predis則便于快速部署；兩者均適用于生產環(huán)境且文檔完善。
我如何了解最新的PHP開發(fā)和最佳實踐？
Jun 23, 2025 am 12:56 AM
TostaycurrentwithPHPdevelopmentsandbestpractices,followkeynewssourceslikePHP.netandPHPWeekly,engagewithcommunitiesonforumsandconferences,keeptoolingupdatedandgraduallyadoptnewfeatures,andreadorcontributetoopensourceprojects.First,followreliablesource
什么是PHP，為什么它用于Web開發(fā)？
Jun 23, 2025 am 12:55 AM
PHPbecamepopularforwebdevelopmentduetoitseaseoflearning,seamlessintegrationwithHTML,widespreadhostingsupport,andalargeecosystemincludingframeworkslikeLaravelandCMSplatformslikeWordPress.Itexcelsinhandlingformsubmissions,managingusersessions,interacti
如何設置PHP時區(qū)？
Jun 25, 2025 am 01:00 AM
tosetTherightTimeZoneInphp，restate_default_timezone_set（）functionAtthestArtofyourscriptWithavalIdidentIdentifiersuchas'america/new_york'.1.usedate_default_default_timezone_set_set（）
