Skip to main content

组合图示例

在仪表板中您可以添加各种可视化组件来展示数据,本节以组合图为例带您快速了解创建仪表板的流程。

image

1. 数据准备

新增数据源并添加到数据集。

(1)数据源配置

数据源属性属性值
Web API地址https://mockapi.eolink.com/jLwe6LL471d5112ef61d6b2ebe579a5190be3ee81164537/details_component
请求方法GET
JSON路径$.data[*]

JSON数据:

{
"success": true,
"code": 200,
"message": "successful",
"data": [
{
"id": "1",
"department": "塑胶部",
"type": "利润总额",
"actual": 435.88,
"index": 674.11,
"completion": 64.66
},
{
"id": "2",
"department": "塑胶部",
"type": "净利润",
"actual": 265.88,
"index": 374.11,
"completion": 71.07
},
{
"id": "3",
"department": "化纤部",
"type": "利润总额",
"actual": 996.3,
"index": 811.76,
"completion": 122.73
},
{
"id": "4",
"department": "化纤部",
"type": "净利润",
"actual": 546.3,
"index": 611.76,
"completion": 89.3
},
{
"id": "5",
"department": "帘子部",
"type": "利润总额",
"actual": 855.99,
"index": 945.88,
"completion": 90.5
},
{
"id": "6",
"department": "帘子部",
"type": "净利润",
"actual": 656.3,
"index": 458.33,
"completion": 143.19
}
]
}

注意:数值型数据不要添加双引号。

(2)数据集配置

image

image

2. 创建仪表板

(1)添加可视化组件

image

(2)数据绑定

选中可视化组件进行数据绑定

image