基礎設置
- width：組件在編輯器中的寬度
- height：組件在編輯器中的高度
- top：組件與編輯器頂部的距離
- left：組件與編輯器左側的距離
全域
- 高亮磁區的偏移距離：控制磁區呈現高亮狀態時放大的比例，偏移距離越大放大比例越大
- 間隙大小：控制扇形區域之間的間隙，值越大間隙越大
- 起始角度：磁區起始角度值
- 半徑：通過半徑的設置可以使圓形圖中間鏤空形成一個圓圈
  - 內半徑：圓形圖內圈的半徑大小
  - 外半徑：圓形圖外圈的半徑大小
- 邊線：圓形圖外半徑的邊線
  - 邊線寬度：邊線的寬度，單位px
  - 邊線顏色：邊線的顏色，支持hex、rgb以及rgba格式的色值
- 標籤
  - 顯示/隱藏：是否展示該圖表的標籤
  - 僅高亮展示：標籤僅在磁區呈現高亮狀態時才進行展示
  - 位置：控制標籤展示的位置，可選：外側、內側、中心
  - 顏色：標籤的顏色，支持hex、rgb以及rgba格式的色值
  - 字型大小：標籤的字體大小
  - 字體粗細：標籤字體的粗細
  - 字體：標籤的字體
  - 格式：標籤的展示內容可支援自訂配置，其中{b}表示資料名、{c}表示資料值、{d}表示百分比
- 南丁格爾圖：可通過半徑和圓心維度區分資料大小
  - 開啟/關閉：是否以南丁格爾圖的形式進行展示
  - 模式：選擇展現的形式，可選：半徑、半徑和圓心
標題
- 顯示/隱藏：是否展示該圖表的標題
- 標題名稱：該圖表的標題的名稱
- 左邊距：標題離容器左側的距離
- 上邊距：標題離容器上側的距離
- 文本樣式
  - 字型大小：標題的字體大小
  - 顏色：標題的顏色，支持hex、rgb以及rgba格式的色值
  - 字體：標題的字體
  - 字體粗細：標題字體的粗細

提示框
- 顯示/隱藏：當滑鼠懸浮到圖表上的點時，是否展示其提示的資訊
- 觸發類型：如何觸發提示框的展示
- 格式：提示框的展示內容可支援自訂配置，其中{b}表示資料名、{c}表示資料值、{d}表示百分比
- 背景顏色：提示框的背景顏色，支持hex、rgb以及rgba格式的色值
- 邊線顏色：提示框邊線的顏色，支持hex、rgb以及rgba格式的色值
- 邊線寬度：提示框邊線的寬度，單位px
- 內邊距：提示框的內邊距，例如："5,5,5,5"，代表上右下左邊距分別為5px、5px、5px、5px

圖例
- 顯示/隱藏：是否展示該表圖的圖例
- 左間距：圖例與容器左側的距離
- 頂間距：圖例與容器上側的距離
- 排列方向：圖例的排列方向，可選擇水準 or 垂直進行展示
- 圖例圖示：圖例的圖示，可選圓形、方形、三角形、菱形圖示進行展示
- 文本樣式
  - 字型大小：圖例的字體大小
  - 顏色：圖例的顏色，支持hex、rgb以及rgba格式的色值
  - 字體：圖例的字體
  - 字體粗細：圖例的字體粗細

高亮輪播
- 是否輪播：開啟輪播後，圓形圖將自動高亮展示
- 展示提示框：輪播時，是否展示提示框
- 動畫間隔：輪播的動畫時間間隔，值越小，輪播速度越快

![pic](/images/components/pie-chart/carousel-1.png')" with="350" height="170"> ![pic](/images/components/pie-chart/carousel-2.gif')" height="170">

自訂元素

該配置項為一個陣列，可配置多個自訂元素，自訂的元素可以是普通文本也可以是圖片
- 類型：選擇自訂元素的類型，可選：文本、圖片
- 位置
  - 控制類型：位置的控制類型，可選：系統控制、手動控制
  - 系統控制
    - 橫向位置：可選居左、居中、居右
    - 縱向位置：可選上側、居中、下側
  - 手動控制
    - 左邊距：自訂元素的左邊距
    - 上邊距：自訂元素的上邊距
- 文本
  - 文本內容：文本所要展示的內容
  - 字型大小：文本的字體大小
  - 顏色：文本的顏色，支援hex、rgb以及rgba格式的色值
  - 字體：文本的字體
  - 字體粗細：文本字體的粗細
- 圖片
  - 上載圖片：上載本地的圖片
  - 圖片寬度：設置圖片的寬度
  - 圖片高度：設置圖片的高度

數據

return [{
    graphic:[{
        text:"OneView"
    },{
        image:"https://open.iot.10086.cn/v4/static/common/file/logo.png"
    }],
    data:[
        { value: 62031, name: '奶牛', color:"#1089E7"},
        { value: 13521, name: '公雞', color:"#F57474"},
        { value: 47655, name: '山羊', color:"#8B78F6"},
        { value: 92129, name: '竹鼠', color:"#56D0E3"},
        { value: 92129, name: '母豬', color:"#F8B448"},
    ]
}]

如果在配置項和數據項均對自訂元素進行了配置，系統會優先選擇數據項的配置

graphic：自定元素集合
- text：自訂的文本內容
- image：自訂圖片的線上連結地址

data：磁區數據集合
- value：磁區數值
- name：磁區名稱
- color：磁區顏色

間隙圓形圖

配置

數據

个搜索结果，搜索内容 “”

0 个搜索结果，搜索内容 “”