mirror of https://gitee.com/antv-l7/antv-l7
parent
ba3f7b5676
commit
7ad1648a10
|
@ -158,7 +158,7 @@ drawPoint.enable();
|
|||
开始编辑,绘制完成之后会自动结束。
|
||||
|
||||
```javascript
|
||||
draw.enable()
|
||||
draw.enable();
|
||||
```
|
||||
|
||||
#### disable
|
||||
|
@ -166,7 +166,7 @@ draw.enable()
|
|||
结束编辑
|
||||
|
||||
```javascript
|
||||
draw.enable()
|
||||
draw.enable();
|
||||
```
|
||||
|
||||
### 事件
|
||||
|
|
|
@ -2,6 +2,7 @@
|
|||
title: Draw UI Component
|
||||
order: 2
|
||||
---
|
||||
|
||||
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
||||
|
||||
# 使用
|
||||
|
@ -104,28 +105,27 @@ scene.removeControl(control);
|
|||
|
||||
```javascript
|
||||
const pointDraw = drawcontrol.get('point');
|
||||
|
||||
```
|
||||
|
||||
### getAllData()
|
||||
|
||||
获取每个Draw 实例绘制的结果数据
|
||||
获取每个 Draw 实例绘制的结果数据
|
||||
|
||||
返回数据格式如下
|
||||
|
||||
```javascript
|
||||
{
|
||||
point: []
|
||||
line: []
|
||||
point: [];
|
||||
line: [];
|
||||
}
|
||||
```
|
||||
|
||||
### 事件
|
||||
|
||||
drawControl 的事件类型和每个Draw的事件一致,如果在 drawControl 监听事件会为每个draw增加事件监听。
|
||||
drawControl 的事件类型和每个 Draw 的事件一致,如果在 drawControl 监听事件会为每个 draw 增加事件监听。
|
||||
|
||||
- drawType: Draw 类型
|
||||
- feature: 对应的数据
|
||||
- drawType: Draw 类型
|
||||
- feature: 对应的数据
|
||||
|
||||
#### draw.create
|
||||
|
||||
|
@ -140,14 +140,12 @@ drawControl 的事件类型和每个Draw的事件一致,如果在 drawControl
|
|||
图形更新时触发该事件,图形的平移,顶点的编辑
|
||||
|
||||
```javascript
|
||||
drawControl.on('draw.delete',(e) => {
|
||||
|
||||
})
|
||||
drawControl.on('draw.delete', (e) => {});
|
||||
```
|
||||
|
||||
### style
|
||||
|
||||
style 配置项可以按需配置,内部会和默认值进行merge
|
||||
style 配置项可以按需配置,内部会和默认值进行 merge
|
||||
|
||||
- active 绘制过程中高亮颜色
|
||||
- normal 正常显示状态
|
||||
|
@ -245,6 +243,3 @@ const style = {
|
|||
},
|
||||
};
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -2,6 +2,7 @@
|
|||
title: 绘制 UI 组件
|
||||
order: 2
|
||||
---
|
||||
|
||||
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
||||
|
||||
# 使用
|
||||
|
@ -99,43 +100,42 @@ scene.removeControl(control);
|
|||
## 方法
|
||||
|
||||
### getDraw(type)
|
||||
获取draw实例
|
||||
|
||||
获取 draw 实例
|
||||
|
||||
参数: type 绘制实例 `point|line|polygon|rect| circle`
|
||||
|
||||
```javascript
|
||||
|
||||
const pointDraw = drawcontrol.get('point');
|
||||
|
||||
```
|
||||
|
||||
### getAllData()
|
||||
|
||||
获取每个Draw 实例绘制的结果数据
|
||||
获取每个 Draw 实例绘制的结果数据
|
||||
|
||||
返回数据格式如下
|
||||
|
||||
```javascript
|
||||
{
|
||||
point: [] // geojson数据格式
|
||||
line: []
|
||||
point: []; // geojson数据格式
|
||||
line: [];
|
||||
}
|
||||
```
|
||||
|
||||
### removeAllData()
|
||||
|
||||
移除绘制的的所有数据
|
||||
|
||||
```javascript
|
||||
drawcontrol.removeAllData();
|
||||
|
||||
drawcontrol.removeAllData();
|
||||
```
|
||||
|
||||
|
||||
### 事件
|
||||
|
||||
drawControl 的事件类型和每个Draw的事件一致,如果在 drawControl 监听事件会为每个draw增加事件监听。
|
||||
drawControl 的事件类型和每个 Draw 的事件一致,如果在 drawControl 监听事件会为每个 draw 增加事件监听。
|
||||
|
||||
- drawType: Draw 类型
|
||||
- feature: 对应的数据
|
||||
- drawType: Draw 类型
|
||||
- feature: 对应的数据
|
||||
|
||||
#### draw.create
|
||||
|
||||
|
@ -150,14 +150,12 @@ drawControl 的事件类型和每个Draw的事件一致,如果在 drawControl
|
|||
图形更新时触发该事件,图形的平移,顶点的编辑
|
||||
|
||||
```javascript
|
||||
drawControl.on('draw.delete',(e) => {
|
||||
|
||||
})
|
||||
drawControl.on('draw.delete', (e) => {});
|
||||
```
|
||||
|
||||
### style
|
||||
|
||||
style 配置项可以按需配置,内部会和默认值进行merge
|
||||
style 配置项可以按需配置,内部会和默认值进行 merge
|
||||
|
||||
- active 绘制过程中高亮颜色
|
||||
- normal 正常显示状态
|
||||
|
@ -255,6 +253,3 @@ const style = {
|
|||
},
|
||||
};
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -52,6 +52,18 @@ layer.source(pointsData, {
|
|||
});
|
||||
```
|
||||
|
||||
### 方法
|
||||
获取聚合节点的原始数据,通过Source的 getClustersLeaves方法
|
||||
|
||||
|
||||
|
||||
```javascript
|
||||
const source = layer.getSource();
|
||||
source.getClustersLeaves(id)
|
||||
layer.on('click', (e) => {
|
||||
console.log(source.getClustersLeaves(e.feature.cluster_id));
|
||||
});
|
||||
```
|
||||
|
||||
### 完整示例
|
||||
|
||||
|
|
|
@ -66,6 +66,21 @@ layer.source(data);
|
|||
layer.setData(data);
|
||||
```
|
||||
|
||||
### 方法
|
||||
|
||||
#### getClustersLeaves(cluster_id)
|
||||
|
||||
聚合图使用,获取聚合节点的原始数据
|
||||
|
||||
参数:
|
||||
id 聚合节点的 cluster_id
|
||||
|
||||
```javascript
|
||||
layer.on('click', (e) => {
|
||||
console.log(source.getClustersLeaves(e.feature.cluster_id));
|
||||
});
|
||||
```
|
||||
|
||||
#### JSON
|
||||
|
||||
[JSON 数据格式解析](./json)
|
||||
|
|
|
@ -15,7 +15,6 @@ import { DrawEvent, DrawModes, unitsType } from '../util/constant';
|
|||
import { createCircle, createPoint } from '../util/create_geometry';
|
||||
import moveFeatures, { movePoint } from '../util/move_featrues';
|
||||
import DrawFeature, { IDrawFeatureOption } from './draw_feature';
|
||||
import circle from '@turf/circle';
|
||||
export default class DrawCircle extends DrawFeature {
|
||||
protected startPoint: ILngLat;
|
||||
protected endPoint: ILngLat;
|
||||
|
|
|
@ -39,7 +39,9 @@ export function cluster(
|
|||
type: 'Point',
|
||||
coordinates: item.coordinates,
|
||||
},
|
||||
properties: {},
|
||||
properties: {
|
||||
...item,
|
||||
},
|
||||
};
|
||||
});
|
||||
pointIndex.load(geojson.features);
|
||||
|
|
Loading…
Reference in New Issue