百度地图的覆盖物自定义(二)--点击标注物弹出完全自定义的信息提示窗口(不继承百度提供的Infowindow)
发布时间
阅读量:
阅读量
在百度地图系统中实施(二)--单击标注元素会独立于预设的 Infowindow 展示一个定制化提示框设计。
//----------------复杂的自定义覆盖物-----------------------------------------------
//还未点击的覆盖物
//初始化,提供一下主要改变的参数
function BusUnclickedOverlay(point, pay, id) {
this._point = point;
this._pay = pay;
this._id = id;
}
BusUnclickedOverlay.prototype = new BMap.Overlay(); //继承百度地图提供的覆盖物的类
BusUnclickedOverlay.prototype.initialize = function(map) {
this._map = map;
var div = this._div = document.createElement("div");
div.setAttribute("id", "busUnclickedoverLay" + this._id);
div.style.position = "absolute";
div.style.zIndex = BMap.Overlay.getZIndex(this._point.lat);
div.style.height = "70px";
div.style.width = "150px";
div.style.lineHeight = "70px";
div.style.textAlign = "center";
div.style.background = "url(img/detail2.png) no-repeat";
div.style.color = "#ffffff";
//钱pay
div.style.fontSize = "42px";
div.innerHTML = "¥" + this._pay;
map.getPanes().labelPane.appendChild(div); //将自定义窗口插入到地图样式内部,宠儿达到覆盖默认样式的效果
return div;
}
BusUnclickedOverlay.prototype.draw = function() {
var map = this._map;
var pixel = map.pointToOverlayPixel(this._point);
this._div.style.left = pixel.x - 35 + "px"; //控制这个信息窗口针对标注物原点的偏移量,这也是前面div要设置样式position:absolute;
this._div.style.top = pixel.y - 70 + "px";
}

全部评论 (0)
还没有任何评论哟~
