你可以在不上傳檔案的情況下繪製折線圖,方法是使用一個瀏覽器型圖表工具,該工具會在本機解析你輸入或貼上的資料列,並在同一部裝置上產生可下載的影像。折線圖製作工具完全在目前的瀏覽器分頁中執行:你輸入的文字永遠不會被送到伺服器,也不會跳出檔案選擇對話框,圖表會即時依據你的輸入建立。在你按下產生按鈕之後,預覽中出現的同一個版面會被寫入一個獨立的 SVG 檔案,並由你的瀏覽器儲存到磁碟。因為解析、座標計算、預覽繪製和下載建立都在本機完成,所以這個工作流程特別適合那些你不想傳送的資料——內部銷售總額、功課數字、草稿測量值,或任何你可以在幾分鐘內打完的小型有序資料集。讀者的問題「在使用折線圖製作工具時,能不能不上傳檔案就畫出折線圖」歸結到底就是:這個工具的整個流程是否都在用戶端執行;如果是,答案就是可以。

許多線上圖表工具會把資料經由代管的服務來產生影像。這個步驟通常需要上傳 CSV、貼到遠端編輯器,或登入帳號。對那些處理應留存在自己筆電上的數字的讀者——例如班級名單、個人預算、草稿報告、私人實驗記錄——這個上傳步驟是錯誤的權衡。一個把整個流程都保留在瀏覽器分頁內的工具,可以完全消除這個疑慮,而它所產生的獨立 SVG 也讓最終圖表在瀏覽器、文件編輯器和設計套裝軟體之間同樣方便攜帶。

can i make line graph without uploading a file when using line graph maker
能否在不上傳檔案的情況下繪製折線圖?

在此工具中「無上傳」真正的意思

三個具體檢查可以確認折線圖製作工具是否把你的資料保留在裝置上:

  • 網路面板保持靜默。 打開瀏覽器的開發者工具,在輸入與產生圖表的過程中觀察 Network 分頁。不會有任何夾帶你的標籤或數值的請求離開這個分頁。
  • 不會跳出檔案選擇器。 文字框接受貼上與直接輸入,所以你完全不需要從磁碟選取 CSV 或試算表。
  • 下載檔案在本機產生。 SVG 檔案是由繪製預覽的同一段 JavaScript 所建立,並直接交給瀏覽器的下載管理器,整個過程不會繞經任何伺服器。

折線圖製作工具滿足全部三項檢查。它的說明明確指出,所有解析、座標計算、預覽繪製和下載建立都在目前的瀏覽器中完成,並且你輸入的文字不會被上傳到 Lizely。這個特性正是它能正確回答「資料是否必須離開裝置」這個問題的原因——資料不必離開。

如何在不上傳檔案的情況下繪製折線圖

  1. 在瀏覽器中打開折線圖製作工具。
  2. 在標題欄位中輸入一個簡潔的圖表標題——例如「Q1 週銷售」或「植物高度,第 1–6 週」這類讀者一看就懂的簡短文字。
  3. 以「標籤,數值」的格式,每行輸入一個資料點。每個非空行的最後一個逗號會用來分隔標籤與數值,因此像「New York, East」這類含有逗號的標籤仍能被正確解析。
  4. 按下產生按鈕。工具最多會處理 200 個非空行,繪製預覽,並在圖表旁邊列出任何無效或超過上限的行。
  5. 檢查座標軸標籤、資料列順序以及略過資料列的提示。水平軸會依你輸入的順序顯示標籤;垂直軸則由最小值延伸至最大值。
  6. 點擊下載按鈕以儲存獨立的 SVG 檔案。這個檔案會與預覽完全一致,並包含標題、座標軸、水平格線、資料點標記、連接線,以及可存取的資料點標題。

若想更完整地了解同一個無上傳工作流程,無上傳折線圖指南對每個步驟都有更詳細的說明。

解析器所依據的輸入規則

解析器在每一行只遵守一條規則:非空行上的最後一個逗號會分隔標籤與數值。在該逗號之前的所有內容都會被視為標籤,因此標籤本身可以包含逗號——例如「Region: North, Q1」或「Building 3, Floor 2」這類用法相當實用。空行會被忽略而非計入,因此你可以用空行分隔資料,而不會干擾解析。

數值接受幾種形式。可以是正數、負數、零或小數。科學記號如 1.5e3 或 -2E-4 也同樣接受。空標籤、格式錯誤的數字、Infinity,以及絕對值超過 1e12 的數值會被拒絕,並計入無效資料列。輸入欄位上限為 50,000 個 UTF-16 字碼單位,且工具在單一圖表中最多處理 200 個非空行。如果你的資料集超過任一上限,超出數量會顯示在結果旁邊。這個工具絕不會隱藏上限——無效資料列與超過 200 列上限的資料列會分別回報,因此你可以清楚知道哪些被略過以及原因為何。

至少需要兩個有效資料列,因為單一點無法構成線段。只有一個有效資料列時,圖表無法繪製。

下載的 SVG 包含哪些內容

下載的檔案是一個獨立的 SVG,這是一種開放的向量影像格式,縮放或列印時都能保持清晰。檔案包含圖表標題、座標軸、五條等距的水平參考線、軸標籤、連接線、資料點標記,以及可存取的資料點標題。SVG 使用白色背景與藍色線條,以便在瀏覽器、文件編輯器和設計工具中廣泛相容。

由於輸出是向量格式,圖表不會繼承螢幕截圖的像素尺寸或模糊感。它可以在任何現代瀏覽器中開啟、匯入像 PowerPoint 或 Keynote 等簡報軟體、放入文書處理器,或在 Illustrator、Inkscape 等設計應用程式中開啟。你在螢幕上看到的預覽,就是 SVG 所描述的內容——不會有第二次重新繪製而改變版面的情況。

如果出版物需要特定的品牌配色、自訂字體、無障礙處理或印刷標準,SVG 可以在匯出後用適當的向量工具進行編輯。向量格式是由 W3C SVG 2 規格所定義,而 MDN SVG 教學提供了這個格式的入門介紹。

垂直座標如何對應到數值

垂直軸使用從最小輸入值到最大輸入值的線性刻度。最小值對應到繪圖區的底部,最大值對應到頂部,中間值則依比例置於其間。舉例來說,在一個範圍從 3 到 11、繪圖區高度為 360 像素的設定中,數值 7 對應的 y 座標為:

y = 底部 − ((數值 − 最小值) / (最大值 − 最小值)) × 繪圖區高度 y = 底部 − ((7 − 3) / (11 − 3)) × 360 y = 底部 − (4 / 8) × 360 y = 底部 − 0.5 × 360 y = 底部 − 180

當所有數值都相同時,工具會在這個常數周圍擴展範圍,使線條保持在中央可見,而不會除以零造成範圍為零。座標軸並不會自動從零開始,因此讀者在判斷變化的視覺幅度之前,應先檢查標籤。數字會以標準的 JavaScript 雙精度浮點數運算處理;軸標籤會保留實際有效位數,並對極小或極大的數值使用科學記號。

儲存檔案前值得檢查的限制

在儲存之前,請在預覽與訊息區域檢視以下五項:

  1. 資料列數量。 工具最多處理 200 個非空行。如果你的資料集更長,則只會使用輸入順序中的前 200 列,任何額外的列會被分別計算並回報為超出上限。
  2. 無效資料列。 格式錯誤的數值、空標籤、Infinity,以及絕對值超過 1e12 的數值會被略過。每一筆都會計入無效資料列的提示中。
  3. 座標軸範圍。 垂直刻度從最小有效值到最大值採線性方式呈現。這個範圍不一定從零開始,因此在判斷變化的視覺幅度之前,務必先閱讀軸標籤。
  4. 水平等距。 標籤依資料列索引等距水平排列,而非依據日期或實際的 x 距離。這適用於像一月到五月這類有序序列,但不適合用於間隔不均的時間。
  5. 常數數列。 如果每個數值都相同,工具會在這個常數周圍擴展範圍,讓線條保持在中央可見,而不會塌縮成單一點。

編輯標題或資料會清除已產生的輸出,並停用下載按鈕,直到再次產生圖表。如果在成功產生圖表後發生錯誤,舊的輸出會被清除,而不會留在畫面上讓人誤以為它代表新的輸入。這些行為讓「可見的輸入」與「可見的圖表」之間的關係變得明確。

瀏覽器工具適合的情境

需求瀏覽器折線圖製作工具試算表或繪圖應用程式
將資料保留在裝置上可以——解析與繪製都在本機檔案在本機開啟,但匯出通常會經過選單指令與共用格式
依資料列順序等距水平排列可以——內建功能可透過選擇圖表類型達成
保留不等的 x 距離(真實時間序列)不行——標籤為類別位置可以——使用帶明確 x 欄的散佈圖
獨立 SVG 下載可以——直接產生少見——多數試算表預設匯出點陣圖
迴歸、預測或移動平均不行——圖表只顯示輸入的點可以——許多試算表應用程式會計算這些

對於你在幾分鐘內就能打完的小型有序資料集——例如一週的閱讀紀錄、一個學期的考試成績、某個專案每月的工時——瀏覽器工具是最快的途徑。對於那些水平位置必須反映實際距離或時間間隔,或需要自動趨勢線的資料集,則應選擇試算表或繪圖應用程式作為下一步。

延伸閱讀:命令列 vs 線上圓餅圖製作工具:哪個勝出?。