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

CSV-Lite 輸入語法
資料欄位刻意採用 CSV-lite,而非完整的 CSV。每一列非空白資料必須恰好包含一個逗號,標籤在前,數值代碼在後。空行與僅含空白的行會被靜默忽略,不計入資料列預算。每個標籤與每個數字的前後空白會在解析前先去除,因此從程式碼區塊複製的縮排資料列仍可正確解析。解析器不會在多餘的逗號上切分、不支援引號欄位,也不接受標籤內出現被引號包住的逗號。如果您的來源資料在類別名稱中包含逗號,請在貼上之前於標籤內改用其他分隔符號。每列在圖表中恰好產生一根長條,順序依照輸入順序;工具不會排序、加總或推論單位。
作為快速參考,像 Apples,12 這樣的一列會產生標籤 Apples 與值 12。再加入像 Oranges,7 這樣的第二列,就會在第一根長條右側再產生第二根長條。重複的標籤是允許的,會依輸入順序保留為獨立的長條,這在相同類別於不同時間或不同區段出現時相當實用。
資料列、標籤與值的長度限制
產生作業要求介於 2 到 30 列(含)之間的非空白資料列。低於 2 則請求失敗;超過 30 也會失敗,並回報精確的非空白資料列數。解析器絕不會只保留前 30 列、絕不會略過錯誤的資料列、絕不會代入零,也不會產生部分圖表。只要有一列格式錯誤,整個請求就會被拒,這對一個追求確定性的參考工具而言是最安全的行為。標籤上限為 24 個 UTF-16 程式碼單位,數值代碼上限為 40 個 UTF-16 程式碼單位。限制是精確而非約略的:24 個程式碼單位的標籤會被接受,超過 1 個程式碼單位就會失敗。這是貼上之前必須縮短標籤的唯一實際理由,數值端也適用相同的界線。
接受的數字與被拒的代碼
值必須是非負的有限十進位數字。像是 3.14 這類一般小數,以及像是 1.5e3 這類科學記號皆可接受。負零會被解析並正規化為零,以維持全零資料集的一致性。支援 1e-300 到 1e300 之間的非零值;若詞法上的非零輸入下溢為零,或輸入超過最大值,則會以清楚的狀態加以拒絕。解析器不會運算公式、不理解帶型別的單位、不接受十六進位,也不接受 Infinity 或 NaN。看似為數字但違反上述任一規則的字串,會使整個請求失敗,而不是被靜默強制轉型。
如何產生並下載 SVG
- 在瀏覽器中開啟 長條圖製作工具,並決定是否要加入可選的標題。
- 輸入或貼上介於 2 到 30 列之間的非空白 label,value 配對資料,確保每列非空白資料恰好包含一個逗號,且逗號後為非負有限數字。
- 點擊產生動作並讀取狀態:它會確認類別標籤、五個刻度值、基線、零長條,以及適用於您資料集的任何極值範圍可見性限制。
- 檢查即時預覽中的類別順序、座標軸最大值、刻度間距,以及個別長條的工具提示行為。
- 點擊下載動作以儲存獨立的 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、任何格式錯誤的資料列 |
| 資料列格式 | 恰好一個逗號,標籤在前,數字在後 | 引號欄位、引號內的逗號、多餘欄位、空標籤 |
| 標籤長度 | 最多 24 個 UTF-16 程式碼單位 | 超過 24 個程式碼單位 1 個 |
| 數值代碼長度 | 最多 40 個 UTF-16 程式碼單位 | 超過 40 個程式碼單位 1 個 |
| 數值 | 非負的有限十進位數,含 e/E 記號 | 十六進位、Infinity、NaN、帶型別單位、公式、下溢為零、超過 1e300 |
| 空白 | 前後空白會被去除,空行會被忽略 | 僅含空白的行被計入資料列 |
| 重複標籤 | 允許,依輸入順序保留為獨立長條 | 加總、排序或隱含的單位 |
| 刻度 | 採用整齊 1/2/5/10 上限範圍的線性刻度 | 對數刻度、百分比正規化、最小高度長條 |
| 輸出 | 獨立 SVG,高度 520px,水平擴展 | 點陣圖、內嵌字型、上傳的資料 |
| 編輯行為 | 每次編輯皆會清除預覽、狀態與下載 | 資料變更後留下過期的下載 |
請將此表作為發布前的最後檢查。確認標籤在旋轉後仍清晰可讀、座標軸最大值在整齊範圍取整後仍合理、全零與極值範圍的情況會顯示預期的註記或工具提示,並且任何必要的圖表溝通(例如微小類別與極大值並存、百分比框架、統計推論)都是在工具外部處理,而非由工具內部預設承擔。