百度地图画多边形,画圆, 监听事件不触发原因

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);

 

注意:要把监听事件放到最后后面。因为函数变量命名 是没有变量提升的,如果写在上面,就会找不到这个函数。

 

posted @ 2018-03-19 11:49  daidai201  阅读(3822)  评论(0编辑  收藏  举报