圖像編輯器 - 圖表工具使用案例
讓您更了解圖像編輯器的圖表工具使用方式
圖表區塊工具列說明
資料、內距、更新預覽說明
總圖預覽 設定值 資料 繪製圖表的資料源（可程式化） 內距 邊與內容的距離 上 , 右 ,下 , 左 （舉例：40 ,40 ,95 ,80） ...
圖例 Legend
預覽圖 圖例 Legend - 設定值 一般 啟用 ☑ 啟用圖示 ☐ 不啟用圖示 自動換行 ☑ 自動換行 ☐ 不自動換行 欄位（填...
極座標 Coord
預覽圖 極座標 Coord - 設定值 類型 直角坐標系（例如：折線圖、柱狀圖） 極坐標系（例如：雷達圖、玫瑰圖） 圓餅圖 螺旋坐...
前置處理函數 Transform
預覽圖 前置處理函數 Transform - 設定值 類型 數據過濾 數據加工 字串過濾 字串重新命名 逆序排列 ...
比例尺 Scale
預覽圖 比例尺 Scale - 設定值 欄位 （填入欄位值來做比例尺設定） 類型 類型 說明 舉例 linear 連續的數值 [1 ,...
軸座標 Axis
預覽圖 軸座標 Axis - 設定值 一般 啟用此軸線 ☑ 開啟軸線☐ 隱藏軸線，所有效果都會隱藏掉 欄位 （以哪個...
圖 Geom
預覽圖 圖 Geom - 設定值 欄位 填入的數值來做繪圖 一個值, 大多用來繪製圓餅圖 兩個值, X軸與Y軸類型的圖表 三個...
折線圖
折線圖（Line Chart）用於顯示數據在一個連續的時間間隔或者時間跨度上的變化，它的特點是反映物體隨時間或有序類別而變化的趨勢
基礎折線圖
折線圖數據是遞增還是遞減、增減的速率、增減的規律（週期性、螺旋性等）、峰值等特徵都可以清晰地反映出來。所以，折線圖常用來分析數據隨時間的變化趨勢，也可用來分析多組數據隨時間變化的...
多條折線圖
雙折線圖，用於比對兩組數據的趨勢。 預覽圖 設定值 資料源 [{ "month": "Jan", "city": "Tokyo", "tempera...
曲形折線圖
雙折線圖，用於比對兩組數據的趨勢。 預覽圖 設定值 資料源 [{ "month": "Jan", "city": "Tokyo", "tempera...
階梯折線圖
階梯線圖（也稱為步驟圖）是與線圖相似的圖表，但是線在數據點之間形成分段步驟。當您要顯示以不規則間隔發生的更改時，分階線圖可能 很有用。例如，奶製品價格上漲，汽油，稅率，利率等。 預覽圖 ...
多條階梯折線圖
階梯線圖（也稱為步驟圖）是與線圖相似的圖表，但是線在數據點之間形成分段步驟。當您要顯示以不規則間隔發生的更改時，分階線圖可能 很有用。例如，奶製品價格上漲，汽油，稅率，利率等。 預覽圖 ...
柱狀圖
基礎柱狀圖，使用垂直的柱子顯示類別之間的數值比較。其中一個軸表示需要對比的分類尺寸，另一個軸代表相應的數值。
基礎柱狀圖
柱狀圖有別於直方圖，柱狀圖無法顯示數據在一個區間內的連續變化趨勢。柱狀圖描述的是分類數據，回答的是每一個分類中“有多少？”這個問題。需要注意的是， 當柱狀圖顯示的分類很多時會導致分類名附加等顯示...
分組柱狀圖
預覽圖 設定值 資料源 [{ "name": "London", "月份": "Jan.", "月均降雨量": 18.9 }, { "name...
堆疊柱狀圖
預覽圖 設定值 資料源 [{ name: 'London', 'Jan.': 18.9, 'Feb.': 28.8, 'Mar.': 39.3,...
區間柱狀圖
預覽圖 設定值 資料源 [{ x: '分類一', y: [76, 100] }, { x: '分類二', y: [56, 108] }, {...
基礎條形圖
預覽圖 設定值 資料源 [{ country: '巴西', population: 18203 }, { country: '印尼', pop...
分組條形圖
預覽圖 設定值 資料源 [{ "label": "Mon.", "type": "series1", "value": 2800 }, { "...
堆疊條形圖
預覽圖 設定值 資料源 [{ 'State': 'WY', '小於5歲': 25635, '5至13歲': 1890, '14至17歲': 93...
區間條形圖
預覽圖 設定值 資料源 [{ profession: '兩年制副學士學位', highest: 110000, minimum: 23000, ...
圓餅圖
餅圖通過將一個圓餅按照分類的佔比劃分成多個區塊，整個圓餅代表 數據的總計，每個區塊鏈（圓弧）表示該分類占總體的比例大小，所有區塊鏈（圓弧）的加和等於100％。可以很好地幫助用戶快速了解數據的佔比分配。
基礎圓餅圖
預覽圖 設定值 資料源 [{ item: '事例一', count: 40, percent: 0.4 }, { item: '事例二', ...
基礎圓環圖
環圖，其本質是餅圖將中間區域挖空。 餅圖的整體性太強，我們會將注意力集中在比較餅圖內各個扇形之間佔整體比重的關係。但如果我們將兩個餅圖放在一起，餅圖很難同時對比兩個圖。環圖在解決上述問題時...
單色南丁格爾玫瑰圖
南丁格爾玫瑰圖，又名雞冠花圖、極坐標區域圖，是南丁格爾在克里米亞戰爭期間提交的一份關於士兵死傷的報告時發明的一種圖表,是在極坐標下繪製的柱狀圖，使用圓弧的半徑長短表示數據的大小（數量的多少）。 ...
多色南丁格爾玫瑰圖
預覽圖 設定值 資料源 [{ year: '2001', population: 41.8 }, { year: '2002', popula...
南丁格爾玫瑰圓環圖
預覽圖 設定值 資料源 [{ year: '2001', population: 41.8 }, { year: '2002', popula...
點圖
Scatter Chart，也叫 X-Y 圖，它將所有的數據以點的形式展現在笛卡爾坐標系上，以顯示變量之間的相互影響程度，點的位置由變量的數值決定。
基礎散點圖
通過觀察散點圖上數據點的分佈情況，我們可以推斷出變量間的相關性。如果變量之間不存在相互關係，那麼在散點圖上就會表現為隨機分佈的離散的點，如果存在某種相關性，那麼大部分的數據點就會相對密集並以...
多色散點圖
預覽圖 設定值 資料源 - AntV https://g2.antv.vision/zh/examples/data/scatter.json （ 資料來源：Ant...
多形多色散點圖
預覽圖 設定值 資料源 - AntV https://g2.antv.vision/zh/examples/data/scatter.json （ 資料來源：Ant...
擾動點圖
圖片僅供參考，此點圖會浮動 預覽圖 設定值 資料源 - AntV https://g2.antv.vision/zh/examples/data/dv-grades...
氣泡圖
圖片僅供參考，此點圖會浮動 預覽圖 設定值 資料源 - AntV https://g2.antv.vision/zh/examples/data/bubble.js...
面積圖
面積圖又叫區域圖。它是在折線圖的基礎之上形成的, 它將折線圖中折線與自變量坐標軸之間的區域使用顏色或者紋理填充，這樣一個填充區域我們叫做面積，顏色的填充可以更好的突出趨勢信息。
基礎面積圖
面積圖用於估計數量隨時間而變化的程度，也可用於引起人們對總值趨勢的注意。他們最常用於表現趨勢和關係，而不是傳達特定的值。 預覽圖 設定值 資料源 [{ year...
堆疊面積圖
和基本面積圖一樣，唯一的區別就是圖上每一個數據集的起點不同，起點是基於前一個數據集的，用於顯示每個數值所佔大小隨時間或類別變化的趨勢線，展示的是部分與整體的關係。 層疊面積圖上的最大的面積代表...
區間面積圖
預覽圖 設定值 資料源 [{ time: 1246406400000, constest: 21.5, temperature: [14.3, 27....
片段面積圖
預覽圖 設定值 資料源 [{ time: 1246406400000, constest: 21.5, temperature: [14.3, 27....
正負面積圖
預覽圖 設定值 資料源 [{ year: '1996', north: 322, south: 162 }, { year: '1997', ...
箱型圖
箱型圖，又稱盒須圖、盒式圖或箱線圖，是一種用作顯示一組數據分佈情況的統計圖。
基礎箱型圖
如果一個數據集中包含了一個分類變量和一個或者多個連續變量，那麼你可能會想知道連續變量會如何隨著分類變量水平的變化而變化，而箱形圖就可以提供這種方法，它只用了5個數字對分佈進行概括，即一組數據的最...
一維箱型圖
預覽圖 設定值 資料源 [{ low: 1, q1: 9, median: 16, q3: 22, high: 24 }] 內距...
環狀箱型圖
預覽圖 設定值 資料源 [{ x: 'Oceania', low: 1, q1: 9, median: 16, q3: 22, hi...
基礎箱型圖 (有異常值)
預覽圖 設定值 資料源 [{ x: '職業 A', low: 20000, q1: 26000, median: 27000, q3: 3...
蠟燭圖
燭形圖，原名 K 線圖，蠟燭圖，又稱陰陽圖、棒線、紅黑線或蠟燭線，常用於展示股票交易數據。
雷達圖
雷達圖是以相同點開始的軸上表示的三個或更多個定量變量的二維圖形的形式顯示多變量數據的圖形方法。軸的相對位置和角度通常是不知情的。