百度地圖畫多邊形,畫圓, 監聽事件不觸發原因


var styleOptions = {
strokeColor:"red", //邊線顏色。
fillColor:"red", //填充顏色。當參數為空時,圓形將沒有填充效果。
strokeWeight: 3, //邊線的寬度,以像素為單位。
strokeOpacity: 0.8, //邊線透明度,取值范圍0 - 1。
fillOpacity: 0.6, //填充的透明度,取值范圍0 - 1。
strokeStyle: 'solid' //邊線的樣式,solid或dashed。
}
var drawingManager = new BMapLib.DrawingManager(this.map, {
isOpen: false, //是否開啟繪制模式
enableDrawingTool: true, //是否顯示工具欄
drawingToolOptions: {
anchor: BMAP_ANCHOR_TOP_RIGHT, //位置
offset: new BMap.Size(5, 5), //偏離值
drawingModes: [BMAP_DRAWING_CIRCLE,BMAP_DRAWING_RECTANGLE,BMAP_DRAWING_POLYGON],
drawingTypes : [
BMAP_DRAWING_CIRCLE,//圓的樣式
BMAP_DRAWING_RECTANGLE, //矩形的樣式
BMAP_DRAWING_POLYGON,
]
},
circleOptions: styleOptions, //圓的樣式
polygonOptions: styleOptions, //多邊形的樣式
rectangleOptions: styleOptions //矩形的樣式
});
console.log(drawingManager);
//完成畫圈
var self=this;
var overlaycomplete = function(e){


console.log(e.overlay);

if(self.overlays.length!=0){
for (var i = 0; i < self.overlays.length; i++) {
self.map.removeOverlay(self.overlays[i]);
}
self.overlays.length = 0
}
self.overlays.push(e.overlay);
console.log(self.overlays);
//圓
if(e.drawingMode === "circle"){
self.radius=e.overlay.getRadius();
console.log(self.radius);
//獲取中心點
self.centerlng = e.overlay.getCenter().lng;
self.centerlat = e.overlay.getCenter().lat;
console.log(self.centerlng);
console.log(self.centerlat);
}
//方形
if(e.drawingMode === "rectangle"){
self.square =e.overlay.getPath();
console.log(self.square);
}
//多邊形
if(e.drawingMode === "polygon"){
self.polysquare =e.overlay.getPath();
console.log(self.polysquare);
}

};
//監聽事件
drawingManager.addEventListener('overlaycomplete', overlaycomplete);

 

注意:要把監聽事件放到最后后面。因為函數變量命名 是沒有變量提升的,如果寫在上面,就會找不到這個函數。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM