PHP 繪圖入門（一）：不靠 GD 庫用 HTML 表格畫長條圖

在 GD 库普及前，開發者常利用 HTML 表格模擬圖表效果。本文示範如何僅用 <table> 與 PHP 迴圈，輕鬆產出直觀的長條圖，適合簡單統計展示場景。

核心思路

• 外層 <table> 排列各數據欄位。
• 內層 <table> 的 height 屬性對應數值大小。
• 透過 bgcolor 設定長條顏色，valign="bottom" 使長條底部對齊。

完整範例代碼

<?php
$b = array(150, 110, 125, 180, 160, 175, 230, 220);
?>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <style>
        td { font-size: 9pt; }
    </style>
</head>
<body>
    <table border="0">
        <tr valign="bottom">
            <?php for ($i = 0; $i < 8; $i++) { ?>
                <td align="center">
                    <table height="<?php echo $b[$i]; ?>" border="0">
                        <tr>
                            <td bgcolor="#3F7F9F" width="40"></td>
                        </tr>
                    </table><br>
                    <font color="#3F7F9F"><?php echo $b[$i]; ?></font>
                </td>
            <?php } ?>
        </tr>
    </table>
</body>
</html>

優缺點分析

若需專業級圖表，建議改用 GD 库、Chart.js 或 Highcharts 等現代方案。