腾讯地图常用api封装,在这里做个记录,免得下次需要又去查文档
/**
* 初始化地图
* @param {Object} options
* @return {void}
*/
initMap(options) {
let config = {
rotation: 0, //设置地图旋转角度
pitch:0, //设置俯仰角度(0~45)
zoom:12, //设置地图缩放级别
center: new TMap.LatLng(39.984104, 116.307503) //设置地图中心点坐标
}
config = Object.assign(config, options)
this.map = new TMap.Map('container', config)
},
/**
* 增加点标记
* @param {Array} points
* @return {void}
*/
createMarker(points) {
if (!points.length) return
points = points.map(item => new TMap.LatLng(item.lat, item.lng))
this.markers = new TMap.MultiMarker({
map: this.map,
geometries: points.map(item => ({
position: item,
})),
})
this.map.setCenter(points[0])
}
/**
* 增加线覆盖物
* @param {Array} points
* @return {void}
*/
drowLine(points) {
if (!points.length) return
points = points.map(item => new TMap.LatLng(item.lat, item.lng))
this.polylineLayer = new TMap.MultiPolyline({
id: 'polyline-layer',
map: this.map,
geometries: [
{
paths: points,
},
],
})
},
/**
* 增加多边形覆盖物
* @param {Array} points
* @return {void}
*/
drowPloygon(paths) {
if (paths.length < 3) return
paths = paths.map(item => new TMap.LatLng(item.lat, item.lng))
this.polygon = new TMap.MultiPolygon({
map: this.map,
geometries: [
{
paths,
},
],
})
},
/**
* 清除地图所有覆盖物
* @return {void}
*/
clearMap() {
this.markers && this.markers.setMap(null)
this.markers = null
this.polylineLayer && this.polylineLayer.setMap(null)
this.polylineLayer = null
this.polygon && this.polygon.setMap(null)
this.polygon = null
},