Chart-Maker — 在瀏覽器中建立圖表和圖示的 Web 應用程式
線上 / 離線產生器,29 種圖表類型,支援匯出為 PNG JPEG WEBP AVIF SVG,內建日誌,詳細指南,應用程式安裝
面向用戶 應用
Chart-Maker 應用程式
面向開發者 庫
Chart-Maker 函式庫
圖表設定
進階
JSON
預覽
使用方法 — 詳細說明
「圖表設定」面板包含所有控制項,旁邊的即時預覽會在每次變更時自動更新。在寬螢幕上兩者並排顯示,在手機上則上下堆疊,預覽位於設定下方。
流程:1)選擇圖表類型;2)輸入標題與資料集名稱;3)在下方表格中填寫資料;4)需要時復原或重做;5)開啟「匯出」以下載圖片或儲存專案。
共有 29 種類型,依資料輸入方式分組:
- 標籤 / 值:長條圖、折線圖、面積圖、橫條圖、圓餅圖、環圈圖、雷達圖、極座標圖、文字雲。
- X / Y 點:散佈圖(X, Y)、泡泡圖(X, Y, 大小)。
- 多個資料集:堆疊、分組、多折線、組合(每個資料集為長條或折線)。
- 類別與值清單:盒鬚圖、小提琴圖。
- 階層:樹狀圖(標籤、值、群組)。
- 格點:熱圖(X, Y, 值)。
- 流量:桑基圖(從、到、流量)。
- 地圖:分級著色(從清單中選擇國家,值)。
- 帶誤差線的長條圖
- K線 / OHLC
- 漏斗
- 文氏圖
- 圖(網路)
- 儀表板
- 函數 (y = f(x))
資料表會依所選類型自動調整。「新增列」新增一筆,叉號刪除一筆。
- 標籤 / 值:一個標籤和一個數字。
- 點:X 和 Y(泡泡還有大小)。
- 多個資料集:類別以逗號分隔,每個資料集的值為以逗號分隔的數字清單;組合中每個資料集設為長條或折線。
- 盒鬚 / 小提琴:在值欄位中填入以逗號分隔的數字清單。
- 熱圖:X、Y(類別)和一個值。
- 桑基圖:從、到以及流量大小。
- 分級著色:從下拉清單中選擇國家(名稱使用介面語言),並填入一個值。
- 帶誤差線的長條圖: 標籤, 值, 誤差.
- K線 / OHLC: 日期, O/H/L/C.
- 漏斗: 標籤, 值.
- 文氏圖: 集合(逗號分隔), 值.
- 圖(網路): 節點(逗號分隔), 從/到.
- 儀表板: 值, 最大值.
- 函數 類型繪製 y = f(x)。輸入運算式(如
sin(x)、x^2、sqrt(x))、X 範圍(最小與最大)以及點數。函數 計算運算式並繪製曲線;公式也會顯示在圖表下方的資料清單中。
「匯出」按鈕會開啟一個視窗。
- 格式:PNG、JPEG、WEBP、AVIF(真實格式,在瀏覽器中編碼 — 編碼器於首次使用時載入)與 SVG(向量)。
- 寬度與高度 — 圖片尺寸(像素);留空表示目前圖表尺寸。
- 下載圖片 — 儲存圖片;會加入背景以及圖表下方的資料清單。
- 儲存專案 — 包含所有設定的 .json 檔;勾選「包含歷史與日誌」會將其加入檔案。
- 組合/多資料集中,每個資料集可用左或右 Y 軸。
「匯入」按鈕會開啟一個視窗,其中有一個區域,可將 .json 專案檔拖入或點擊選擇。選擇檔案後,「套用專案」按鈕變為可用,並載入設定(若已儲存,也會載入歷史與日誌)。
- Ctrl/Cmd + Z — 復原
- Ctrl/Cmd + Y 或 Ctrl/Cmd + Shift + Z — 重做
- Ctrl/Cmd + S — 儲存專案
- Ctrl/Cmd + E — 匯出視窗
- Ctrl/Cmd + O — 匯入視窗
- Ctrl/Cmd + J — 日誌
- Ctrl/Cmd + , — 設定
在輸入欄位內,Ctrl+Z 和 Ctrl+Y 作為一般文字編輯使用。
- 復原 / 重做:在資料與設定的變更之間前後移動。
- 日誌:保存動作、提示與錯誤;可以清除。
資料表上方的「進階」區彙整可選設定:副標題;曲線平滑、階梯線、虛線與填滿;堆疊與對數 Y 軸;抽稀;圖例位置;點大小與線寬;動畫時長與緩動;以及依需載入的效果——資料標籤、縮放/平移、註解、趨勢線與十字準線。在組合與多資料集圖表中,每個資料集可使用左或右 Y 軸。每個選項僅在適用的類型中顯示。