給初學者的圓餅圖產生器,是一種只要點一下就能把一串標籤和數字的純文字清單,變成一張完成且色彩編碼的圓餅圖的工具,無需註冊、也不用計算——通常是在你的瀏覽器中本地繪製圖表,並讓你把結果下載成 PNG。初學者打開搜尋框時,通常帶著三個擔憂:怕必須學試算表公式、必須安裝軟體,或必須自己算出百分比,圖表才會看起來正確。一個真正對初學者友善的工具會把這三個問題全部消除。你只要用簡單的「標籤,數值」格式輸入或貼上一份清單,看著圓餅圖在你輸入的同時重畫,圖看起來對了就把圖存下來。百分比會根據你提供的數字自動算出,圖表是在你瀏覽器分頁內的 HTML canvas 上繪製,PNG 也在你自己的裝置上產生,所以你輸入的數字永遠不會離開你的電腦。「貼上、看一眼、儲存」這個組合,就是一個快速的瀏覽器工具和較重的繪圖軟體之間的差別,而這也正是 圓餅圖產生器 的設計核心。

什麼讓圓餅圖產生器對初學者友善
不是每個自稱簡單的繪圖工具,在你實際開始用之後還真的那麼簡單。對從沒做過圓餅圖的人來說,最重要的功能是那些能讓你不會在中途卡住的功能。以下五個特點區別了一個適合初學者的工具和一個學習曲線較陡的工具。
第一個是零設定就能開始。你打開網頁,已經有一個空白的資料框在等你了,不需要建立帳號、不必安裝外掛、也不必下載軟體。第二個是寬容的輸入格式。初學者輸入的資料不會很乾淨;他們會貼上從試算表複製過來的雜亂欄位或潦草筆記,常常帶有多餘空白、空白行或零散的標點。一個適合初學者的工具會盡可能讀取能讀的內容,跳過讀不到的,而不是直接跳出錯誤。第三個是即時預覽。圖表會在你輸入時重畫,所以「我加了一列」和「出現了一塊那個顏色的扇形」之間的關聯是立即且可見的。第四個是自動計算百分比。你輸入原始數字;工具會算出每塊扇形佔整體的比例。第五個是一鍵匯出。圖表看起來對了,你就把它存成 PNG,不必為了檔案類型、圖層或匯出對話框傷腦筋。
圓餅圖產生器滿足這五項。它完全在你的瀏覽器分頁中執行,所以沒有任何東西需要安裝。輸入欄位接受「標籤,數值」這種格式的行,會忽略空白行,自動去除多餘空白,並跳過缺少有效非負數的行,而不是直接壞掉。圖表會在你編輯時即時重畫。百分比是根據你輸入的數值算出來。並且有一個下載連結可以把完成的圖存成 PNG,背景為白色,可以乾淨地放到投影片、文件或訊息中。
三步驟做出你的第一張圓餅圖
如果你從沒做過圓餅圖,這是從「我有一串數字」到「我有一張可以分享的圖」的最短路徑。在瀏覽器中打開圓餅圖產生器,然後照著以下三個步驟操作。
- 把你的資料輸入到方框中,一列一筆,格式為「標籤,數值」。一份簡單的瀏覽器市佔率清單可能像這樣: Chrome, 63 Safari, 20 Edge, 12 Other, 5 每一新的一行會變成一個扇形。空白行會被忽略,標籤和數字周圍的多餘空白會被去除,任何沒有有效非負數的行會被跳過,而不是讓圖表壞掉。
- 可以選擇在圖表上方輸入一個標題,說明整個圓圈代表什麼,例如「瀏覽器市佔率,2025 年 10 月。」
- 點擊下載連結,把圖表存成 PNG 圖片。PNG 會在你的裝置上產生並存到下載資料夾,可以直接拖進投影片、文件或聊天視窗中。
這就是完整的工作流程。沒有樣式選單、沒有圖表類型下拉選單,也沒有座標軸要設定,因為圓餅圖本來就不用座標軸。如果你第一次嘗試看起來不對,編輯資料框中的一行,看著圖表重畫——百分比標籤、扇形大小和圖例都會同時更新。
四個數字的初學者範例
為了把步驟講清楚,這裡用真實的數字完整跑一次工具。假設你想展示 100 份問卷回覆如何分配到四個答案選項。你在資料框中輸入四行:
非常滿意,42 有點滿意,31 有點不滿意,18 非常不滿意,9
工具會讀取每一行,把數值加總到 100,並根據每塊扇形佔總數的比例,指派一個百分比給它。扇形大小為:100 中的 42 是 42 個百分比,31 是 31 個百分比,18 是 18 個百分比,9 是 9 個百分比。每塊扇形會從內建色盤拿到一種不同的顏色,圖表旁邊的圖例會顯示每一列的標籤、原始數值和四捨五入後的百分比。數學運算已經幫你做好了,而你唯一需要打的只是四行「標籤,數值」。
如果你想在儲存前對自己的資料做個小小的視覺檢查,請記住:列的排列順序就是扇形出現的順序,從最上方開始。要讓圖表看起來乾淨的一個快速方法是,把列從最大排到最小。上面的範例已經這樣排了,所以最大的扇形會落在十二點鐘的位置。
每個初學者都該知道的輸入格式規則
因為資料框很寬容,了解它到底接受什麼格式是值得的,才不會浪費時間清理輸入內容。以下規則適用於圓餅圖產生器,以及幾乎所有遵循相同模式的瀏覽器工具。
| 你輸入的內容 | 工具的行為 |
|---|---|
| Chrome, 63 | 讀取標籤「Chrome」和數值 63,然後依它佔總數的比例畫出對應大小的扇形。 |
| " Firefox, 20 " | 去除標籤和數字周圍的多餘空白,然後正常讀取這一列。 |
| 列與列之間的空白行 | 忽略空白行,繼續讀取下一個有效的列。 |
| Safari, twenty | 跳過這一行,因為「twenty」不是非負數;圖表的其他部分仍然會畫出來。 |
| Q1 2026, Q2 2026, 18 | 把「Q1 2026」當作標籤,讀取 18 作為數值,因為數字是從該行最後一個逗號之後讀取,所以當數值是最後一個欄位時,標籤可以安全地包含逗號。 |
| Empty slice, 0 | 接受這一行並建立一個沒有可見寬度的扇形;圖例仍然會顯示這個項目。 |
| Edge, -5 | 跳過這一行,因為工具只接受非負數。 |
簡單來說:數值永遠是從一行中的最後一個逗號之後讀取,最後一個欄位中任何不是非負數的內容會被跳過,而你輸入的其他內容會照原樣保留。
常見的初學者錯誤與如何避免
第一次做圓餅圖會遇到的問題,大多來自三個地方:資料、標籤或扇形數量。只要知道要找什麼,這些問題都不難修正。
把數值放在標籤前面。工具預期的是「標籤,數值」,而不是「數值,標籤」。如果某個扇形在圖例中沒有標籤,逗號很可能放錯位置了。
使用太多扇形。圓餅圖最好讀的情況是 2 到 6 個扇形。一旦你有 10 或 12 個類別,小的那些會變成薄薄的切片,圖例也會變成一大片文字。在貼上資料之前,把很小的類別合併成一個「其他」列。
讓標籤太長。像「對新結帳流程有點不滿意」這種標籤,在圖例中佔的空間比扇形本身還大。較短的標籤(例如「有點不滿意」或「不滿意」)能讓圖例保持整潔。
忘記百分比是計算出來的。初學者有時會預先算好「Chrome 63%, Safari 20%」並把這些當數值輸入。這在視覺上看起來沒問題,但這代表圖例中的百分比會是根據百分比算出,而不是根據原始數量算出。請輸入原始數字,讓工具去計算比例。
在加標題之前就儲存。標題是告訴讀者這個圓圈代表什麼最簡單的方式。沒有標題的話,再完美的圖表也只是幾塊有顏色的扇形。
讓第一張圖表看起來專業的技巧
圓餅圖不需要太多設計工作就能看起來乾淨。三個小習慣就能涵蓋讓一張圖表看起來像出自設計師之手而非預設效果的大部分重點。
把列從最大排到最小,讓最大的扇形落在最上方,較小的扇形依順時針方向排列。標籤保持一兩個簡短的詞,讓圖例保持精簡。加上說明整體的標題,例如「Q3 問卷回覆」或「10 月行銷預算」,這樣讀者就不必猜測扇形加總代表什麼。
其他部分就交給圓餅圖產生器處理。扇形使用內建色盤上色,所以每塊扇形都有不同的顏色,百分比會顯示在圖例中每個標籤旁邊,下載的 PNG 帶有乾淨邊緣的白色背景,可以直接放進投影片、報告或聊天視窗,不需額外處理。如果你想繪製的是預算,三步驟預算教學 用真實的支出類別涵蓋了同樣的工作流程。
因為圖表是在你自己瀏覽器分頁內的 HTML canvas 上繪製,PNG 也在你的裝置上產生,所以你輸入的數字永遠不會離開你的電腦。這讓這個工具對內部指標、問卷回覆,或任何你不想上傳的內容都相當安全——這是當你第一次貼上真實數字時,一個會讓人安心的優點。
想更深入了解,請參考 無聊時怎麼辦(給初學者):快速入門指南。