關於VUE使用高德JsApi(三)——操作map物件案例
阿新 • • 發佈:2021-06-29
案例一 新增點標記
建立一個方法
//傳入map物件、座標點、自定義圖片、響應方法 mMarkers(map,positions,imgUrl,click){ let img=new AMap.Icon({ // 圖示尺寸 size: new AMap.Size(50, 50), // 圖示的取圖地址 image: imgUrl, // 圖示所用圖片大小 imageSize: new AMap.Size(50, 50), // 圖示取圖偏移量 imageOffset: new AMap.Pixel(-9, -3) }); var markers = []; for (var i = 0, marker; i < positions.length; i++) { marker = new AMap.Marker({ map: map,//最終都是繫結到map物件中的 position: positions[i], icon: img, offset: new AMap.Pixel(-13, -30), }); marker.on('click',click);//點標記點選響應方法 marker.setTitle('阿巴阿巴');//當前點標記文字標籤 markers.push(marker); } return markers; }
使用
let img='//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png';
let positions = [[xxx,xxx]];
let axb=this.mMarkers(this.map,positions,img,(e)=>{
console.log(e);//e是當前點標記的引數
});
this.map.remove(axb);//刪除當前所有點標記