雷達圖-多邊形
雷達圖是常規圖表中的一種，支援自訂文本、圖形，支援多系列資料配置，能夠使用雷達圖直觀地展示多維度的類目資料對比情況。本文檔為你介紹基本雷達圖各配置項的含義，幫助你快速準確地使用基本雷達圖組件
配置
基礎設置
width：組件在編輯器中的寬度
height：組件在編輯器中的高度
top：組件與編輯器頂部的距離
left：組件與編輯器左側的距離
雷達圖設置
- 繪製類型：控制雷達圖的輪廓樣式，可選圓形、多邊形
- 半徑比例：雷達圖在固定區域中的展示大小
- 名稱與軸的間距：雷達圖名稱與軸的間距大小
- 分割段數：雷達圖的分割區域層級
指示器名稱
顯示/隱藏：是否展示指示器名稱
字型大小：指示器名稱的字體大小
顏色：指示器名稱的顏色，支持hex、rgb以及rgba格式的色值
字體粗細：指示器名稱字體的粗細
字體：指示器名稱的字體
背景顏色：指示器的背景顏色
上下內邊距：指示器的上下內邊距
左右內邊距：指示器的左右內邊距
軸線
顯示/隱藏：是否展示軸線
箭頭：軸線兩端的箭頭
軸線樣式
顏色：軸線的顏色，支持hex、rgb以及rgba格式的色值
粗細：軸線的粗細
樣式：軸線的樣式，可選實線、虛線
透明度：軸線的透明度
分割線
顯示/隱藏：是否展示分割線
分割線樣式
顏色：分割線的顏色，支持hex、rgb以及rgba格式的色值
粗細：分割線的粗細
樣式：分割線的樣式，可選實線、虛線
透明度：分割線的透明度
分割區域
顯示/隱藏：是否展示分割區域
分割區域樣式
間隔色1：奇數間隔區域顏色，支援hex、rgb以及rgba格式的色值
間隔色2：偶數間隔區域顏色，支援hex、rgb以及rgba格式的色值
透明度：分割區域的透明度
標題
顯示/隱藏：是否展示該圖表的標題
標題名稱：該圖表的標題的名稱
左邊距：標題離容器左側的距離
上邊距：標題離容器上側的距離
文本樣式
字型大小：標題的字體大小
顏色：標題的顏色，支持hex、rgb以及rgba格式的色值
字體：標題的字體
字體粗細：標題字體的粗細
提示框
顯示/隱藏：當滑鼠懸浮到圖表上的點時，是否展示其提示的資訊
觸發類型：如何觸發提示框的展示
格式：提示框的展示內容可支援自訂配置，其中{b}表示資料名、{c}表示資料值
背景顏色：提示框的背景顏色，支持hex、rgb以及rgba格式的色值
邊線顏色：提示框邊線的顏色，支持hex、rgb以及rgba格式的色值
邊線寬度：提示框邊線的寬度，單位px
內邊距：提示框的內邊距，例如："5,5,5,5"，代表上右下左邊距分別為5px、5px、5px、5px
圖例
顯示/隱藏：是否展示該表圖的圖例
左間距：圖例與容器左側的距離
頂間距：圖例與容器上側的距離
排列方向：圖例的排列方向，可選擇水準 or 垂直進行展示
圖例圖示：圖例的圖示，可選圓形、方形、三角形、菱形圖示進行展示
文本樣式
字型大小：圖例的字體大小
顏色：圖例的顏色，支持hex、rgb以及rgba格式的色值
字體：圖例的字體
字體粗細：圖例的字體粗細
資料數列
該配置項為一個陣列，可配置多個系列，編輯器將遍歷資料，使資料通過一個或多個系列配置迴圈渲染。若需要自訂某些資料為特定樣式則需要手動對資料進行排序
拐點標記
標記圖形：可選圓形、正方形、三角形、菱形、針形、箭頭
標記大小：標記圖形的大小
標記顏色：標記圖形的顏色，支援hex、rgb以及rgba格式的色值
標記透明度：標記圖形的透明度
標籤
顯示/隱藏：是否顯示標記圖形處的標籤
與標記的間距：標籤與標記圖形的間距
字型大小：標籤的字體大小
顏色：標籤的顏色，支持hex、rgb以及rgba格式的色值
字體：標籤的字體
字體粗細：標籤的字體粗細
高亮
開啟高亮：是否開啟高亮
標記顏色：高亮狀態下標記圖形的顏色，支援hex、rgb以及rgba格式的色值
標記透明度：高亮狀態下標記圖形的透明度
連接線
顏色：連接線的顏色，支持hex、rgb以及rgba格式的色值
線寬：連接線的寬度，單位px
樣式：連接線的樣式，可選實線、虛線
透明度：連接線的透明度
高亮
開啟高亮：是否開啟高亮
顏色：高亮狀態下連接線的顏色，支持hex、rgb以及rgba格式的色值
線寬：高亮狀態下連接線的寬度，單位px
樣式：高亮狀態下連接線的樣式，可選實線、虛線
透明度：高亮狀態下連接線的透明度
連接區域
顏色：連接區域的顏色，支援hex、rgb以及rgba格式的色值
透明度：連接區域的透明度
高亮
開啟高亮：是否開啟高亮
顏色：高亮狀態下連接區域的顏色，支援hex、rgb以及rgba格式的色值
透明度：高亮狀態下連接區域的透明度
數據
return [{
indicator:[
{ name: '指標1',max: 100, min:0 },
{ name: '指標2',max: 100, min:0 },
{ name: '指標3',max: 100, min:0 },
{ name: '指標4',max: 100, min:0 },
{ name: '指標5',max: 100, min:0 },
{ name: '指標6',max: 100, min:0 }
],
data:[{
value: [ 50, 50, 50, 50, 50, 50],
name: '公司A',
}]
}]
indicator：指示器數據，用來指定雷達圖中的變數維度
name：指示器名稱
max：指示器的最大值
min：指示器的最小值
data：雷達圖數據集合
name：數據名稱
value：數據值
return [{
indicator:[
{ name: '語12文', max: 100, min:0 },
{ name: '數撒旦士大夫學', max: 100, min:0 },
{ name: '英語', max: 100, min:0 },
{ name: '物理', max: 100, min:0 },
{ name: '化學', max: 100, min:0 },
{ name: '生物', max: 100, min:0 }
],
data:[{
value: [ 70, 95, 60, 80, 30, 60],
name: '小王',
}]
}]
