function Tooltip(options) {
this.marker_ = options.marker;
this.content_ = options.content;
this.map_ = options.marker.get('map');
this.cssClass_ = options.cssClass || null;
this.is_hidden = options.is_hidden === undefined ? !0 : options.is_hidden;
this.div_ = null;
this.setMap(this.map_);
var me = this;
if(this.is_hidden){
google.maps.event.addDomListener(me.marker_, 'mouseover', function(){
me.show();
});
google.maps.event.addDomListener(me.marker_, 'mouseout', function(){
me.hide();
});
}
}
Tooltip.prototype = new google.maps.OverlayView();
Tooltip.prototype.onAdd = function() {
var div = document.createElement('DIV');
div.style.position = "absolute";
div.style.visibility = "visible";
if(this.is_hidden)
div.style.visibility = "hidden";
else
div.style.visibility = "visible";
div.innerHTML = this.content_;
this.div_ = div;
var panes = this.getPanes();
panes.floatPane.appendChild(this.div_);
var me = this;
google.maps.event.addDomListener(this.div_, 'click', function(){
if(me.map_.getZoom() < 18){
me.map_.setZoom(me.map_.getZoom() + 1);
me.map_.setCenter(me.marker_.getPosition());
}
});
}
Tooltip.prototype.draw = function() {
var overlayProjection = this.getProjection();
var ne = overlayProjection.fromLatLngToDivPixel(this.marker_.getPosition());
var div = this.div_;
div.style.left = ne.x + 'px';
div.style.top = ne.y + 'px';
}
Tooltip.prototype.onRemove = function() {
this.div_.parentNode.removeChild(this.div_);
}
Tooltip.prototype.hide = function() {
if (this.div_) {
this.div_.style.visibility = "hidden";
}
}
Tooltip.prototype.show = function() {
if (this.div_) {
this.div_.style.visibility = "visible";
}
}
开始在marker上,显示的提示信息,使用的是infowindow,但是infowindow太丑了,而且位置总是在上面,于是就找到了这段代码。
这是一段别人写的代码,我改了两个地方。
1。不是所有的提示信息都是隐藏的,有一部分是一直显示的,比如重点的车站,城市,部分是鼠标放上去显示。
2.单击某个点的时候,放大地图,并且将该点置于地图中心。
content里可以传入html代码,cssClass里,可以设置样式。
来源:oschina
链接:https://my.oschina.net/u/248756/blog/482666