Skip to main content

折线图

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

image

1. 数据准备

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

(1)数据源配置

数据源属性属性值
Web API地址https://result.eolink.com/jLwe6LL471d5112ef61d6b2ebe579a5190be3ee81164537?uri=/line-chart-example
请求方法GET
JSON路径$.data[*]

JSON数据:

{
"success": true,
"code": 200,
"message": "successful",
"data": [{
"id": "1",
"month": "一月",
"orderamount": 99,
"orderprofit": 180
}, {
"id": "2",
"month": "二月",
"orderamount": 70,
"orderprofit": 160
}, {
"id": "3",
"month": "三月",
"orderamount": 140,
"orderprofit": 200
}, {
"id": "4",
"month": "四月",
"orderamount": 100,
"orderprofit": 180
}, {
"id": "5",
"month": "五月",
"orderamount": 100,
"orderprofit": 180
}, {
"id": "6",
"month": "六月",
"orderamount": 100,
"orderprofit": 180
}, {
"id": "7",
"month": "七月",
"orderamount": 180,
"orderprofit": 190
}, {
"id": "8",
"month": "八月",
"orderamount": 100,
"orderprofit": 180
}, {
"id": "9",
"month": "九月",
"orderamount": 140,
"orderprofit": 120
}, {
"id": "10",
"month": "十月",
"orderamount": 110,
"orderprofit": 170
}, {
"id": "11",
"month": "十一月",
"orderamount": 150,
"orderprofit": 120
}, {
"id": "12",
"month": "十二月",
"orderamount": 140,
"orderprofit": 181
}],
"count": 12
}

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

(2)数据集配置

image

image

2. 创建仪表板

(1)添加可视化组件

image

(2)数据绑定

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

image