# 基于 mapbox-gl-draw 完善绘制功能

## install

```shell
npm install @dijiang/front_mapbox_custom_draw
```

## use

```js
import MapboxDrawer from '@dijiang/front_mapbox_custom_draw'

const drawer = new MapboxDrawer(map)
```

## switch tool

```js
drawer.switchDrawTool(drawType, styleTemplate, option)
```
返回一个promise，值为绘制的图形，测量工具为null  
参数如下：

### drawType 绘制类型

| name     | drawType         |
| -------- | ---------------- |
| 标点     | draw_point       |
| 直线     | draw_line_string |
| 自由绘线 | freeline         |
| 细箭头   | straightarrow    |
| 多边形   | draw_polygon     |
| 测距     | measure_line     |
| 测面     | measure_polygon  |
| 曲线     | curve            |
| 正圆     | circle           |
| 椭圆     | ellipse          |
| 矩形     | rectangle        |
| 扇形     | sector           |
| 曲线面   | closecurve       |
| 钳击箭头 | doublearrow      |
| 燕尾箭头 | tailsquadarrow   |
| 文字标注 | text             |


### styleTemplate 样式模板

获取默认样式，根据用户界面进行修改：

```js
const styleTemplate = drawer.getStyleTemplate(drawType)

/* styleTemplate:{_color: '#f00',_size: 10 ...} */
```

当UI触发修改后：
```js
drawer.changeStyle(key, value);
```

地图交互选中已经绘制的图形抛出其样式：
```js
 drawer.select(currentSelectStyle => toSetUi(currentSelectStyle));
```

### option 
测量工具信息，{unit: 'm' | 'km'}


## methods
```js
// 如上：
switchDrawTool()
select()
changeStyle()
getStyleTemplate()



// 返回上一步操作
trash():void

// 获取所有
getAll(): features

// 删除所有
deleteAll():void

```