npm package: @simonsimone/geomaputils
Description: 地图应用类组件
Author: simonsimone
Latest version: 1.0.2

# 地图应用类组件
> 越来越多的项目涉及到地图，这些项目里有相同的地图功能，比如：标点、标线等，将这些功能抽出来，分解为多个可重用组件，提高开发效率

##   使用说明
# 一、安装依赖
``` bash
npm i @simonsimone/geomaputils
```
# 二、vue项目入口文件调用
``` bash
在vue项目的入口文件'main.js',写入以下代码：

import geomaputils from '@simonsimone/geomaputils'
import '@simonsimone/geomaputils/lib/geomaputils.css'
Vue.use(geomaputils)
``` 
现在，@simonsimone/geomaputils已经安装并且可以在你的项目中使用了。你可以开始使用 @simonsimone/geomaputils提供的组件来构建你的应用界面。

# 三、组件中使用
#### 1. 地图瓦片组件组件：
``` bash
 <MapContainer :config="configObj"  @initMaP="getMapInstance"  lngText="Longitude" @mapClick=""/>
``` 

| 参数       |  说明     | 类型      | 默认值    
| :-------- | :--------| :-------: | :--------|
| config| 配置项参数 | Object   | null | 
| lngText|经度文本（多语言） |  String      | 经度 |  
| latText| 纬度文本（多语言） |   String   | 纬度 |  
| zoomText| 缩放级别文本（多语言） |   String   | 缩放级别 |  

| 事件       |  说明     | 返回参数         
| :-------- | :--------| :-------: | 
| initMaP| 初始化地图 |  地图实例对象(使用this.$nextTick()) | 
| mapClick|地图上的点击的事件 |  e |  
| mouseMove| 地图上的鼠标移动事件   | e |  
| mapZoom| 地图缩放的事件 |    e |  
| contextmenu| 地图右键菜单时的事件  | e |  
| dbClick| 地图上的双击事件 | e |  


#### 2. 标点组件：
支持展示tip信息
支持展示不同点类型
支持点击后icon变化
点击、双击事件(返回参数e里已添加点的唯一标识toolId ，可以通过e.target.options.toolId获取)
``` bash
 <MarkPoint  :latlng ="latlng"/>
``` 
| 参数       |  说明     | 类型      | 默认值    
| :-------- | :--------| :-------: | :--------|
| latlng | 点的经纬度 | Object   | null | 
| name|点的名称 空值时不展示浮层 |  String      | '' |  
| type| 点的类型 (0:融合点；1:雷达点 3:无人机；默认：坐标点) |   Number   | null |  
| toolId| 点的唯一标识 |      | new Date().getTime() |  

| 事件       |  说明     | 返回参数         
| :-------- | :--------| :-------: | 
| click| 单击点的回调 |  e | 
| dblclick|双击点的回调 |  e |  

#### 3. 标线组件：
标线
控制展示tip信息
点击、双击事件(返回参数e里已添加线的唯一标识toolId ，位置：e.target.options.toolId)
``` bash
 <MarkLine :piontArr="piontArr"/>
``` 
| 参数       |  说明     | 类型      | 默认值    
| :-------- | :--------| :-------: | :--------|
| piontArr | 点的经纬度数组，一边绘制一边更新此值(realDot:是否是端点，端点会添加圆圈，否则线条跟随鼠标移动） | Array   |  | 
| name|线的名称 空值时不展示浮层 |  String      | '' |  


| 事件       |  说明     | 返回参数         
| :-------- | :--------| :-------: | 
| click | 单击线的回调 |  e | 
| dblclick|双击线的回调 |  e |  

#### 4. 标注工具popup组件：
标点、标线、标面操作后的命名弹窗
``` bash
 <MarkPop :open = "open" @cancleMarkPop = "" />
``` 
| 参数       |  说明     | 类型      | 默认值    
| :-------- | :--------| :-------: | :--------|
| open | 是否显示  | Boolean   | FALSE | 
| popTitle|标题区的内容（多语言)  |  String      | 标点信息|  
| labelName|标签文本的内容（多语言) |  String      | 名称 |  
| value|输入框的内容，可用于回显 |  String      | '' |  
| cancleText|取消按钮的文本内容（多语言) |  String      | 取消 |  
| confimText|确定按钮的文本内容（多语言) |  String      | 确定 |  



| 事件       |  说明     | 返回参数         
| :-------- | :--------| :-------: | 
| cancleMarkPop  | 点击取消按钮的回调 |   | 
| submitMarkPop |点击提交按钮的回调 |  输入框的内容 |  

#### 5. 扇形组件
``` bash
 <MarkSemiCircle :center="center" :radius="radius" :startAngle="startAngle" />
``` 
#### 6. 测量转角组件
``` bash
  <MarkAngle  :pointsArr="pointsAngle" :showClose="showClose"/>
``` 
#### 7. 绘制轨迹组件
``` bash
  <MarkRoute :points="routesPoints" :routeId="routeId"/>

``` 
#### 8. 批量标点组件
``` bash
  <MarkMorePoint :info="info" :delAll="delAll"/>
  
``` 

> 时间原因，部分组件使用方式未做详细说明，详询作者