長條圖產生器接受以嚴格的精簡 CSV 語法撰寫、含 2 至 30 個非空白的標籤與數值列,每列恰好一個逗號,並在目前的瀏覽器分頁中將其渲染為垂直長條圖,再把那段完全相同的字串匯出為獨立的 SVG。本工具專為精簡的類別資料集所設計:一個可選的標題、一小組類別,以及每個類別對應一個非負數。它刻意省略完整的 CSV 功能,讓解析器保持可預測、版面保持確定性,且匯出檔案能與預覽逐位元組相符。本速查表完整收錄每一條已公布的輸入規則、長度上限、數值格式、渲染決策與下載行為,讓您能直接貼上、產生、驗證並匯出,不必重讀說明文件。請將它視為撰寫列資料時的工作參考;當產生作業拒絕您的輸入,或您需要確認圖表實際內容時,再回頭核對一次。以下規則即為解析器實際強制執行的內容,而非泛用的建議。

精簡 CSV 輸入語法
資料欄位刻意採用精簡 CSV,而非完整 CSV。每個非空白列必須恰好包含一個逗號,標籤在前,數值代碼在後。空行與僅含空白的行會被靜默忽略,不計入列數預算。各標籤與數值前後的前後空白會在解析前先被修剪,因此即便是從程式碼區塊複製過來的縮排列群,也能乾淨地解析。解析器不會以額外的逗號切分、不接受引號欄位,也不接受標籤內含引號的逗號。若您的來源資料的類別名稱中含有逗號,請在貼上之前,先以其他分隔符替代標籤中的逗號。每列會依輸入順序產生恰好一條長條;本工具不會排序、彙總或推論單位。
為了快速對照,Apples,12 這類一列會產生標籤 Apples 與數值 12。再加上 Oranges,7 這種第二列,就會在第一條右側再建立第二條長條。允許重複的標籤,且會依輸入順序保留為獨立長條;當同一類別在不同時間或不同段落中出現時,這項行為相當實用。
列、標籤與數值的長度上限
產生作業要求介於 2 到 30 列的非空白列(包含 2 與 30)。少於 2 列時請求會失敗;超過 30 列時請求也會失敗,並回報精確的非空白列數。解析器絕不會只保留前 30 列、絕不會略過錯誤的列、絕不會代入零,也絕不會產生部分圖表。只要有一列格式錯誤,就會拒絕整個請求;對一款強調確定性的參考工具來說,這是最安全的行為。標籤上限為 24 個 UTF-16 碼位,數值代碼上限為 40 個 UTF-16 碼位。此上限是精確而非概略:24 個碼位的標籤可被接受,超過一個碼位就會失敗。這是您在貼上之前必須縮短標籤的唯一實際理由,數值端亦適用相同的邊界。
接受的數值與拒絕的代碼
數值必須為非負且有限的十進位數。3.14 這類一般小數,以及 1.5e3 這類科學記號,皆可接受。負零會被解析並正規化為零,讓全為零的資料集保持一致。1e-300 到 1e300 之間的非零數值皆受支援;會下溢為零的詞法非零輸入,以及超過最大值的輸入,會以清楚的狀態予以拒絕。解析器不會求值公式、無法辨識具型別的單位、不接受十六進位,也不接受 Infinity 或 NaN。看似數值但違反上述任一規則的字串,會讓整個請求失敗,而不是被靜默強制轉型。
如何產生並下載 SVG
- 在瀏覽器中開啟 長條圖產生器,並決定是否要加入可選的標題。
- 輸入或貼上介於 2 至 30 列的非空白 標籤,數值 列,確保每個非空白列恰好包含一個逗號,且逗號後為非負有限數值。
- 點擊產生動作,並閱讀狀態資訊:它會確認類別標籤、五個刻度值、基線、零長條,以及適用於您資料集的任何極值範圍可見度限制。
- 檢查即時預覽中的類別順序、座標軸最大值、刻度間距,以及個別長條的工具提示行為。
- 點擊下載動作以儲存獨立的 SVG;該檔案係依預覽中顯示的精確字串所建立,因此所見即所匯出。
- 請在下載完成後再編輯標題或資料,因為任何編輯都會立即清除先前的預覽、狀態與下載。
渲染後的圖表內容
每次成功產生都會輸出一張垂直長條圖,每個接受的列對應一條長條、可見的基線,以及沿繪製範圍均勻分布的五個數值參考刻度。長條高度採非負線性刻度,零對應到基線,顯示的座標軸最大值對應到繪圖區頂端。上限會向上取整為 1、2、5 或 10 乘以十的某次方,讓五個刻度始終落在乾淨的數值上。此由產品定義的「友善刻度」做法具有確定性,但並不保證能重現每一種 D3 的刻度選擇;此處採用的刻度規則記載於 D3 線性刻度參考文件。類別標籤會旋轉,以便在新增列時仍保持可讀性;圖表會水平擴展,避免 30 個標籤被擠進行動裝置的寬度。每條長條皆帶有顯示原始數值的工具提示;當未提供標題時,SVG 內含以預設 Bar chart 作為標題備援的可存取描述。座標值會進行邊界驗證,並在標記中四捨五入至小數三位;座標軸標籤最多使用六位有效數字,或採科學記號顯示。
全為零與極值範圍的邊界情況
若所有數值皆為零,圖表會切換為明確的零到一參考範圍,讓所有長條維持在基線上的零高度,並顯示「全為零」的註記。這能避開除以零的流程,同時不改動任何輸入值。在另一個極端,數值範圍過寬時,正向長條可能在 SVG 座標精度下視覺上與零無法區分;此時工具提示仍會回報精確數值,但長條本身可能短到看不見。本工具不會自行產生最低高度的長條,因為這會破壞所述的線性刻度。當較小的類別必須與高出數個數量級的數值並存時,速查表的建議是改用對數圖,或將資料拆成多張圖表。此圖表不使用對數刻度、不正規化為百分比,也不暗示統計顯著性;因此上述任何解讀都必須由外部分析自行補充。
隱私、跳脫與輸出行為
每一步解析、版面配置、跳脫與下載作業,皆在目前的瀏覽器分頁中執行。任何標籤、數值、標題、SVG 字串或互動皆不會被上傳,因此即便貼上內部或草稿資料,也無須更動您的威脅模型。使用者字串在進入文字、工具提示、標題或可存取性屬性之前,皆會進行 XML 跳脫;「&」、角括號、引號與撇號皆會轉為實體,XML 不允許的控制字元與未配對的代理對會轉為 U+FFFD。因此類似指令碼的標籤仍會以可見文字呈現,而不會成為 SVG 元素;標記亦符合 W3C SVG 2 規格 對 SVG 命名空間中標準 rect、line、text、g 與 title 元素的規範。成功產生時,系統會由預覽所用的同一段 SVG 字串建立一個 Blob URL;該 URL 會在以下情況被釋出:標題或資料變更、結果被取代、產生失敗,或元件卸載時。如此可同時避免立即釋出造成的下載競爭,以及 ObjectURL 持續累積的洩漏。Blob 建立或 URL 建立失敗時,會回傳錯誤,而絕不會產生過期的下載。
規則速查表
| 項目 | 接受 | 拒絕 |
|---|---|---|
| 非空白列數 | 2 至 30(包含 2 與 30) | 少於 2、多於 30、任何格式錯誤的列 |
| 列格式 | 恰好一個逗號,標籤在前,數值在後 | 引號欄位、引號中的逗號、額外欄位、空標籤 |
| 標籤長度 | 最多 24 個 UTF-16 碼位 | 超過 24 一個碼位 |
| 數值代碼長度 | 最多 40 個 UTF-16 碼位 | 超過 40 一個碼位 |
| 數值 | 非負且有限的十進位數,含 e/E 科學記號 | 十六進位、Infinity、NaN、具型別單位、公式、下溢為零、超過 1e300 |
| 空白 | 前後空白會被修剪,空行會被忽略 | 僅含空白的行計入列數 |
| 重複標籤 | 允許,依輸入順序保留為獨立長條 | 彙總、排序或隱含單位 |
| 刻度 | 採用 1/2/5/10 友善上界的線性刻度 | 對數刻度、百分比正規化、最低高度長條 |
| 輸出 | 獨立 SVG,高度 520px,水平延伸 | 點陣圖、嵌入字型、上傳資料 |
| 編輯行為 | 每次編輯皆會清除預覽、狀態與下載 | 資料變更後仍殘留過期的下載 |
發布前請將本表作為最後一關檢查。確認標籤旋轉後仍清晰可讀、座標軸最大值在經過「友善刻度」取整後仍然合理、全為零與極值範圍的情境會顯示預期的註記或工具提示,以及任何必要的圖表溝通(在極大數值旁的微小類別、百分比框架、統計推論)應由工具外部處理,而不是預設由工具承擔。
延伸閱讀:讚美產生器速查表:控制項與限制。
延伸閱讀:命令列 vs 線上心智圖製作工具:該選哪一個。