百度地图自定义覆盖物点击事件在移动界面后点击事件会消失的问题

百度地图自定义覆盖物点击事件在移动界面后点击事件会消失的问题

最近用到了百度地图，使用了自定义覆盖物后，出现了问题，就是界面首次加载时，点击事件可以用，但是移动地图后就失效了，在看了官方的类参考之后，发现了原因

只要实现了这个方法，在方法里面重新添加事件就可以了

//自定义覆盖物
	ComplexCustomOverlay.prototype.initialize = function(map) {
		this._map = map; // 保存map对象实例  
		//创建一个父盒子
		var div = this._div = document.createElement("div"); //创建一个盒子节点
		div.style.position = "absolute";
		div.style.boxSizing = "content-box" //内外边距不向内塌陷
		div.style.zIndex = BMap.Overlay.getZIndex(this._point.lat);
		div.style.backgroundColor = "#fff";
		div.style.border = "1px solid #000";
		div.style.color = "white";
		div.style.height = "45px";
		div.style.whiteSpace = "nowrap";
		div.style.MozUserSelect = "none";
		div.style.fontSize = "12px"

		//头部信息条
		var boxHead = this._boxHead = document.createElement("div");
		boxHead.style.position = "absolute";
		boxHead.style.boxSizing = "content-box" //内外边距不向内塌陷
		boxHead.style.backgroundColor = "#2877AF";
		boxHead.style.height = "20px";
		boxHead.style.padding = "2px"
		boxHead.style.top = "-27px";
		boxHead.style.lineHeight = "20px"; //以实现文字居中
		boxHead.style.marginLeft = "50%";
		boxHead.style.transform = "translateX(-50%)";
		boxHead.style.borderRadius = "3px"; //圆角边框
		div.appendChild(boxHead);

		//头部信息条内容
		var span = this._span = document.createElement("span"); //创建一个文本节点
		boxHead.appendChild(span);
		span.appendChild(document.createTextNode(this._text)); //创建一个文本节点

		var that = this;

		//插入图片
		var img = this._img = document.createElement("img");
		img.src = "img/1.png";
		img.style.height = "40px";
		div.appendChild(img);

		//红色倒三角图标
		var arrow = this._arrow = document.createElement("div");
		arrow.style.background = "url(img/label.png) no-repeat";
		arrow.style.position = "absolute";
		arrow.style.width = "11px";
		arrow.style.height = "10px";
		arrow.style.top = "45px";
		arrow.style.left = "10px";
		div.appendChild(arrow);

		map.getPanes().labelPane.appendChild(div); // 将div添加到覆盖物容器中

		this._div = div; // 保存div实例
		return div;
	}


//给覆盖物定位
	ComplexCustomOverlay.prototype.draw = function() {
		var map = this._map;
		var pixel = map.pointToOverlayPixel(this._point); //根据地理坐标获取对应的覆盖物容器的坐标，此方法用于自定义覆盖物
		this._div.style.left = pixel.x - parseInt(this._arrow.style.left) + "px";
		this._div.style.top = pixel.y - 57 + "px";

		//每当视图移动时，点位将会刷新，所以需要重新添加事件
		myCompOverlay1.addEventListener('click', function() {
			map.openInfoWindow(infoWindow, point); // 开启信息窗口
		});
	}

//创建点标记
	var txt1 = "1111";
	var myCompOverlay1 = new ComplexCustomOverlay(new BMap.Point(117.714328, 50.112275), txt1);
	//添加点标记
	map.addOverlay(myCompOverlay1);

//点击事件
	ComplexCustomOverlay.prototype.addEventListener = function(event, fun) {
		this._div['on' + event] = fun;
	}

var sContent =
		`	
				<h4 style='margin:0 0 5px 0;'>
					巴拉巴拉巴拉
				</h4>
				<img style='float:right; width: 150px; height: 150px;' id='imgDemo' src='img/1.png' width='139' height='104'/>
			
				<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>
					巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉
				</p>
		`;
	var infoWindow = new BMap.InfoWindow(sContent);

// 添加点标记点击事件
	myCompOverlay1.addEventListener('click', function() {
		map.openInfoWindow(infoWindow, point); // 开启信息窗口
	});