使用 Gantt Chart Maker 建立甘特圖時,任務標籤不能包含逗號,因為每一個非空白的輸入列都會以正好兩個字面上的逗號,在不支援引號欄位或跳脫分隔符的精簡 CSV 格式中,區隔任務名稱與其開始日期、結束日期。這個限制並非風格上的選擇,而是解析的合約:只要標籤在任何位置加入第三個逗號,解析器就會計算出四個欄位,整個請求會被拒絕,不會回傳任何圖表。好消息是,不含逗號的改寫版本在列印出來的時程表上看起來通常一樣整潔,而且它們能通過工具套用的所有其他驗證規則。以分號、斜線、豎線、長破折號或一對括號替代,不僅能保持標籤的可讀性,也能保留兩個逗號的列結構,而產生的 SVG 在對 &、角括號、引號與撇號進行 XML 跳脫後,仍會逐字呈現你所輸入的標籤。本文將逐步說明這條規則存在的原因、哪些替代字元在列印時程表上看起來最合適、解析器接受的確切列格式,以及如何將最終圖表下載為獨立的 SVG 檔案。
無論你管理的是單一專案清單,還是貼上整個團隊的時程,每一列都適用同一條雙逗號規則,所以一次解決逗號問題,就是取得乾淨匯出結果的最快途徑。

為何這個格式禁止標籤內含逗號
Gantt Chart Maker 將貼上的輸入視為「精簡 CSV」,而非完整的 CSV。每一個非空白列必須包含正好兩個字面上的逗號,留下三個欄位:任務標籤、開始日期、結束日期。不支援引號欄位、引號內的逗號、額外的欄位、跳脫分隔符,以及多行欄位。欄位前後的空白會被去除,但逗號計數是在去除空白之前進行的,因此用空白包裹標籤並無法隱藏多出來的逗號。標籤最多可包含 80 個 UTF-16 程式碼單位,選填的標題最多 100 個,原始時程輸入最多 20,000 個程式碼單位。
由於這個格式刻意保持精簡,只要有一個格式錯誤的列,整個請求就會被拒絕;解析器既不會略過錯誤的列,也不會回傳部分圖表。部分時程表會比空白的錯誤訊息更容易誤導讀者,因此採取嚴格立場才是重點所在。標籤的容量上限、雙逗號要求,以及嚴格的日期格式彼此配合:只要缺少其中任何一項,驗證器就無法保證解析後的列能描述你預期的時程。
這也是為什麼一個「需要逗號」的標籤必須在使用前改寫。這個工具不會試著猜測第三個逗號是裝飾還是分隔符,也不會在背地裡嘗試修復列。
在標籤內清晰易讀的替代字元
任何不會增加逗號數量的字元都可以使用,包括英文排版之外的標點符號與簡單的 ASCII 替代符。下表列出常見的替代方式,以及每種方式在列印時程表上看起來最自然的場景。
| 替代符號 | 標籤範例 | 最適合的情境 |
|---|---|---|
| 分號 | Design; review | 單一任務內的步驟群組 |
| 斜線 | Build / test | 連續階段 |
| 豎線 | Plan | scaffold | 平行的作業流程 |
| 長破折號 | Kickoff — launch | 不含日期的敘述 |
| 括號 | QA (regression) | 簡短的註記 |
| 中點 | Draft · edit | 精簡的堆疊呈現 |
這些替代方式都能通過驗證器,因為它們不會改變逗號的數量。仍有幾項額外規則需要注意:標籤須控制在 80 個 UTF-16 程式碼單位以內,避免使用控制字元(渲染器會以 U+FFFD 取代),並請記住 &、角括號、雙引號或撇號在匯出的 SVG 中會被轉換為對應的 XML 實體,以確保它們呈現為可見文字而非標記。
使用安全標籤建立圖表
- 在瀏覽器分頁中開啟 Gantt Chart Maker,若有需要,可輸入最多 100 個 UTF-16 程式碼單位的標題。
- 將所有包含逗號的標籤改寫為不含逗號;以分號、斜線、豎線、長破折號或一對括號取代,並讓每個標籤保持在 80 個 UTF-16 程式碼單位以內。
- 貼上 2 到 30 列任務,每個非空白行一列,格式為 task,start,end,每列必須有正好兩個字面上的逗號。
- 每個日期請以嚴格的 YYYY-MM-DD 格式輸入,使用真實的 UTC 曆法日期,並確認每個結束日期皆落於其開始日期當日或之後。
- 點擊 Generate,接著仔細查看預覽中的每條長條、刻度與標籤,確認時程符合你的預期。
- 點擊 Download SVG 以下載由完整預覽字串所建立的獨立檔案;兩者使用的標記相同,因此儲存的圖表就是審核過的圖表。
決定圖表能否產生的日期規則
日期會以實際的推算格里高利 UTC 曆法日期進行驗證,而非透過寬鬆的字串解析處理。必須包含四位數字、一個連字號、兩位月份數字、再一個連字號,以及兩位日期數字。字面上的年份範圍從 0000 到 9999,完整的 UTC 年份 setter 可避免 JavaScript 對 0 到 99 年之間的數字 Date.UTC 特殊處理。下表列出驗證器接受與直接拒絕的輸入。
| 輸入 | 結果 | 原因 |
|---|---|---|
| 2026-03-14 | 接受 | 真實的格里高利日期 |
| 2024-02-29 | 接受 | 2024 為閏年 |
| 2025-02-29 | 拒絕 | 2025 不是閏年 |
| 2026-04-31 | 拒絕 | 4 月只有 30 天 |
| 2026-13-01 | 拒絕 | 第 13 個月無效 |
| 2026/03/14 | 拒絕 | 不允許斜線 |
| 2026-3-14 | 拒絕 | 缺少補零 |
每個結束日期皆為包含當日:一個從 1 月 1 日到 1 月 3 日的任務會在時程表中佔據三個日曆日欄位,而開始與結束日期相同的任務則佔據一個。具體來說,以包含當日的開始日編號為 1、包含當日的結束日編號為 3 計算,該任務的包含日數為 3 − 1 + 1 = 3 天。水平範圍從最早的任務開始日開始,延伸至最晚的包含任務日之後,因此即使是一天的專案也會產生可見的長條,且計算過程永遠不會以零個經過的時間長度做除法。
標籤文字如何在匯出的 SVG 中保持安全
使用者字串是安全的 SVG 文字,而不是標記。&、角括號、雙引號與撇號會被轉換為 XML 實體,而 XML 不允許的控制字元與獨立的代理對則會變成 U+FFFD。標籤只有在經過這個轉換後,才會出現在 text 與 title 工具提示節點中,選填的 title 與無障礙 aria-label 也採用相同的跳脫方式。即使是看似指令碼的標籤,仍會以可見字元呈現,而非 SVG 元素,因此使用角括號撰寫的標籤會在輸出中以跳脫後的實體呈現,永遠不會被執行。
匯出的 SVG 使用 W3C 命名空間、固定的 1,100 像素邏輯寬度、依列數而異的高度、白色背景、格線、標籤、矩形長條、title 工具提示、viewBox,以及無障礙的 role 與 label,符合 W3C SVG 2 規範 中定義的結構。較寬的輸出會在預覽中捲動,而不是將標籤壓縮至無法閱讀的行動裝置寬度。
輸出同樣有大小預算。SVG 設定了明確的 100,000 個 UTF-16 程式碼單位上限,以完整的序列化字串進行檢查;正好等於上限可接受,超過一個單位則失敗,並不會截斷或取樣任何標記後綴。成功產生後,會從完整的 SVG 建立一個 Blob URL,該 URL 會持續存在,足以讓同源的 anchor 下載正常運作,並在標題或資料變更、結果被取代、產生失敗,或元件卸載時予以撤銷。這個流程避免了立即撤銷造成的下載競爭,以及 ObjectURL 持續累積所造成的洩漏。
這個工具未涵蓋的部分
此圖表描述的是日曆上的佔用情況,而不是時數、工作日、工作投入、完成百分比或資源容量。它不會解析 Microsoft Project 檔案、相依性、里程碑、要徑、假日、工作行事曆、進度、指派人、成本、基準線或時區時間戳記。它不會判斷重疊的工作是否可行,也不會保證時程是否合理。相依性規劃、協作、權限、稽核紀錄與營運承諾,請使用專門的專案管理軟體。
其他所有處理程序都保留在你的裝置上。解析、UTC 日期運算、SVG 建立、預覽渲染、Blob 建立與下載,全部都在目前的瀏覽器分頁中執行。時程、標題、SVG 或互動資料皆不會被上傳,因此即使時程本身具有敏感性,改寫逗號的反覆過程仍能維持隱私。