Tianheng-map NPM

地图组件

一个基于 leaflet 封装的地图组件

组件属性

prop	type	description
`crs`	Object	地图的 crs 坐标系统
`zoom`	Number	缩放级别
`center`	Array	地图中心点
`zoomConfig`	Object	缩放组件配置 `{"control":true,"doubleClickZoom":false,"position":"bottomright"}`
`drawConfig`	Object	绘制配置 `{"color":"#409EFF","fillColor":"#409EFF","fillOpacity":0.5}`
`measureConfig`	Object	测量配置 `{"weight":3,"color":"#039bec","showTip":true,"showResult":true,"unitDistance":"kilometer","unitArea":"kilometer","precisionDistance":2,"precisionArea":2,"precisionCoord":6,"customTip":{"step1":"单击开始绘制","step2":"单机继续绘制","step3":"右键单击结束绘制"}}`

事件

Event	Data	Description
`mapReady`	Map	初始化完成后返回地图对象
`drawResult`	{type: String, data: Object}	返回绘制的类型和数据

方法

Method	Args	Returns	Description
`addLayer`	Layer	`void`	在地图上添加 layer
`removeLayer`	Layer	`void`	地图移除掉 layer
`createPane`	Pane	`void`	创建Pane并设置其 z-index
`enableDraw`	`String`	`void`	开启绘制并在绘制结束调用`drawResult`，参数类型为'Line', 'Polygon', 'Rectangle', 'Circle'与事件 `drawResult`里的 type 对应
`clearDraw`	`无`	`void`	关闭绘制，清除绘制结果
`setTiandituMap`	`String`	`void`	添加一个天地图底图，参数为天地图的tk
`enableSideBySide`	Tilelayer,Tilelayer	`void`	启用左右卷帘功能，参数为左图和右图
`setSideLeftLayer`	Tilelayer	`void`	`void`	替换左图图层
`setSideRightLayer`	Tilelayer	`void`	`void`	替换右图图层
`disableSideBySide`	`无`	`void`	`void`	禁用左右卷帘功能
`enableMeasure`	`String`	`void`	开启测量功能并在结束调用`measureResult`，参数类型为'distance', 'area', 'coord'
`disableMeasure`	`无`	`void`	禁用测量功能并清除绘制的内容
`resetMap`	`无`	`void`	重置地图边界
`fitBounds`	Bounds,Option	`void`	地图根据传入的图形居中
`setView`	Latlng,Option	`void`	设置地图中心点
`getMap`	`无`	Map	获取地图对象

使用

main.js 里 import

import TianhengMap from 'tianheng-map'
import 'tianheng-map/index.css'

License

MIT

tianheng map tianheng-map leaflet

@geoman-io/leaflet-geoman-free @turf/turf element-resize-detector esri-leaflet leaflet proj4leaflet vue

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago