antv-l7/docs/api/source/source.zh.md

189 lines
3.8 KiB
Markdown
Raw Normal View History

2019-11-21 13:06:13 +08:00
---
title: Source
order: 0
---
2019-12-07 19:56:26 +08:00
## 概述
2019-11-21 13:06:13 +08:00
source 地理数据处理模块主要包含数据解析parser),和数据处理(transform);
- data
- option
- cluster **boolean** 是否聚合
- clusterOption 聚合配置项
- parser 数据解析配置
- transforms 数据处理配置
2019-12-07 19:56:26 +08:00
### parser
2019-11-21 13:06:13 +08:00
2019-12-02 15:16:45 +08:00
不同数据类型处理成统一数据格式。矢量数据包括 GeoJON, CSVJson 等不同数据格式,栅格数据,包括 RasterImage 数据。将来还会支持瓦片格式数据。
2019-11-21 13:06:13 +08:00
空间数据分矢量数据和栅格数据两大类
- 矢量数据 支持 csvgeojsonjson 三种数据类型
2019-12-02 15:16:45 +08:00
- 栅格数据 支持 imageRaster
2019-11-21 13:06:13 +08:00
2019-12-07 19:56:26 +08:00
### transform
2019-11-21 13:06:13 +08:00
2019-12-07 19:56:26 +08:00
数据转换,数据统计,网格布局,数据聚合等数据操作。
2019-11-21 13:06:13 +08:00
2019-12-07 19:56:26 +08:00
## API
2019-11-21 13:06:13 +08:00
### cluster `boolean` 可选 可以只设置
### clusterOption 可选
- radius 聚合半径 **number** default 40
- minZoom: 最小聚合缩放等级 **number** default 0
- maxZoom: 最大聚合缩放等级 **number** default 16
[聚合图使用案例](../../../examples/point/cluster)
2019-12-07 19:56:26 +08:00
### parser
2019-11-21 13:06:13 +08:00
2019-12-07 19:56:26 +08:00
**配置项**
2019-11-21 13:06:13 +08:00
2019-12-07 20:25:52 +08:00
- type: `csv|json|geojson|image|raster`
- 其他可选配置项,具体和数据格式相关
2019-11-21 13:06:13 +08:00
2019-12-07 19:56:26 +08:00
#### geojson
2019-11-21 13:06:13 +08:00
2019-12-07 19:56:26 +08:00
[geojson](https://www.yuque.com/antv/l7/dm2zll) 数据为默认数据格式,可以 不设置 parser 参数
2019-11-21 13:06:13 +08:00
```javascript
2019-12-07 19:56:26 +08:00
layer.source(data);
2019-11-21 13:06:13 +08:00
```
2020-01-07 15:55:55 +08:00
### Source 更新
如果数据发生改变,可以需要更新数据
可以通过调用 layer 的 setData 方法实现数据的更新
具体见 [Layer](../layer/layer/#setdata)
```javascript
layer.setData(data);
```
2019-12-07 19:56:26 +08:00
#### JSON
2019-12-07 20:25:52 +08:00
[JSON 数据格式解析](./json)
2019-11-21 13:06:13 +08:00
#### csv
2019-12-02 15:16:45 +08:00
[CSV 数据格式解析](./csv)
2019-11-21 13:06:13 +08:00
栅格数据类型
2019-11-21 13:06:13 +08:00
#### image
[Image 数据格式解析](./image)
2019-11-21 13:06:13 +08:00
### transforms
2020-01-08 00:17:58 +08:00
tranforms 处理的是的标准化之后的数据
标准化之后的数据结构包括 coordinates 地理坐标字段,以及其他属性字段。
2020-01-07 21:15:23 +08:00
2020-01-08 00:17:58 +08:00
处理完之后返回的也是标准数据
2020-01-07 21:15:23 +08:00
2020-01-15 15:52:31 +08:00
```json
[
{
"coordinates": [[]], // 地理坐标字段
"_id": "122", // 标准化之后新增字段
"name": "test",
"value": 1
// ....
}
]
2020-01-07 21:15:23 +08:00
```
目前支持两种热力图使用的数据处理方法 gridhexagon transform 配置项
2019-11-21 13:06:13 +08:00
- type 数据处理类型
2019-12-02 15:16:45 +08:00
- tansform cfg  数据处理配置项
2019-11-21 13:06:13 +08:00
#### grid
生成方格网布局,根据数据字段统计,主要在网格热力图中使用
2019-12-02 15:16:45 +08:00
- type: 'grid',
- size: 网格半径
- field: 数据统计字段
- method: 聚合方法  count,max,min,sum,mean 5 个统计维度
2019-11-21 13:06:13 +08:00
```javascript
2019-12-02 15:16:45 +08:00
layer.source(data, {
transforms: [
{
type: 'grid',
size: 15000,
field: 'v',
method: 'sum',
},
],
});
2020-01-07 21:15:23 +08:00
```
2020-01-08 00:17:58 +08:00
2019-11-21 13:06:13 +08:00
#### hexagon
2019-12-02 15:16:45 +08:00
2019-11-21 13:06:13 +08:00
生成六边形网格布局,根据数据字段统计
2019-12-02 15:16:45 +08:00
- type: 'hexagon',
- size: 网格半径
- field: 数据统计字段
2019-12-07 19:56:26 +08:00
- method:聚合方法   count,max,min,sum,mean 5 个统计维度
2020-02-05 21:36:29 +08:00
#### join
数据连接,业务中跟多情况是地理数据和业务数据分开的两套数据,我们可与通过 join 方法将地理数据和业务数据进行关联。
**配置项**
- type: join
- sourceField 需要连接的业务数据字段名称
- data 需要连接的数据源 仅支持 json 格式
- targetField 关联的地理数据字段名称
```javascript
2020-02-06 23:42:10 +08:00
const data = {
type: 'FeatureCollection',
features: [
2020-02-05 21:36:29 +08:00
{
2020-02-06 23:42:10 +08:00
type: 'Feature',
properties: {
city: '北京',
2020-02-05 21:36:29 +08:00
},
2020-02-06 23:42:10 +08:00
geometry: {},
},
],
};
2020-02-05 21:36:29 +08:00
const data2 = [
{
2020-02-06 23:42:10 +08:00
name: '北京',
value: 13,
2020-02-05 21:36:29 +08:00
},
{
2020-02-06 23:42:10 +08:00
name: '天津',
value: 20,
},
];
2020-02-05 21:36:29 +08:00
// data 是地理数据
// data2 属性数据或者业务数据
// 通过join方法我们就可以将两个数据连接到一起
2020-02-06 23:42:10 +08:00
layer
.source(data, {
transforms: [
(type: 'join'),
(sourceField: 'name'), //data1 对应字段名
(targetField: 'city'), // data 对应字段名
(data: data2),
],
})
.color('value'); // 可以采用data1的value字段进行数据到颜色的映射
2020-02-05 21:36:29 +08:00
```