Google Map API学习记录

/*InitGoogleMapMouseRightContextMenuStart*/
functioninitializeGoogleMapContextMenu(){
/*contextMenu*/
_contextMenu=document.createElement("div");
$(_contextMenu).css({display:"none"});
varcontextMenuImage=document.createElement("img");
$(contextMenuImage).css({cursor:"pointer"});
$(contextMenuImage).click(clickContextMenuEvent);
contextMenuImage.src="/images/btn_mouse_right_upload.png";
_contextMenu.appendChild(contextMenuImage);
map.getContainer().appendChild(_contextMenu);

//BindEvent

GEvent.addListener(map,"singlerightclick",function(pixel,tile){
_contextMenuClickPixel=pixel;
varx=_contextMenuClickPixel.x;
vary=_contextMenuClickPixel.y;

if(x>map.getSize().width-120){x=map.getSize().width-120}
if(y>map.getSize().height-100){y=map.getSize().height-100}
//判断是否登陆

if(!checkLogin()){
alert("请先登录,在上传视频");
return;
}
//设置菜单位置

varpos=newGControlPosition(G_ANCHOR_TOP_LEFT,newGSize(x,y));
pos.apply(_contextMenu);
displayContextMenu();
});
}
functionclickContextMenuEvent(){
//Googlemapapi内置像素转坐标函数

varpoint=map.fromContainerPixelToLatLng(newGPoint(_contextMenuClickPixel.x,_contextMenuClickPixel.y));
var_params={
lat:point.lat(),
lng:point.lng()
};
//弹出一个窗口

varmyHtml=createIframeHtml(310,310,"upload.aspx",_params);
map.openInfoWindowHtml(point,myHtml)
}
//显示菜单

functiondisplayContextMenu(){
$(_contextMenu).show();
//点击任意位置，隐藏菜单

$(document).one('click',hideContextMenu);
}
//隐藏菜单

functionhideContextMenu(){
$(_contextMenu).hide();
}
/*InitGoogleMapMouseRightContextMenuEnd*/

//GISGroundOverlay
functionGISGroundOverlay(imageUrl,bounds,opacity){
this.imageUrl_=imageUrl;
this.bounds_=bounds;
this.opacity_=opacity||1;
this.overlayImgId_="__groundoverlay_img";
}
GISGroundOverlay.prototype=newGOverlay();
GISGroundOverlay.prototype.initialize=function(map){
varpane=map.getPane(G_MAP_MAP_PANE);
$(pane).empty();
vardiv=document.createElement("div");
div.style.position="absolute";
varimg=document.createElement("img");
img.id=this.overlayImgId_;
img.src=this.imageUrl_;
$(img).css({"opacity":this.opacity_});
if(this.imageUrl_){
$(div).append(img);
}
pane.appendChild(div);

this.div_=div;
this.map_=map;
this.img_=img;
}
GISGroundOverlay.prototype.setOverlayImage=function(src){
if(src){
$("#"+this.overlayImgId_).attr("src",src);
}
}
GISGroundOverlay.prototype.remove=function(){
if(this.div_.parentNode)
this.div_.parentNode.removeChild(this.div_);
}
GISGroundOverlay.prototype.copy=function(){
returnnewGISOverlay(this.bounds_);
}
GISGroundOverlay.prototype.setOpacity=function(opacity){
$(this.img_).css({"opacity":opacity});
}
GISGroundOverlay.prototype.redraw=function(force){
if(!force)return;

//CalculatetheDIVcoordinatesoftwooppositecornersofourboundsto
//getthesizeandpositionofourrectangle
varc1=this.map_.fromLatLngToDivPixel(this.bounds_.getSouthWest());
varc2=this.map_.fromLatLngToDivPixel(this.bounds_.getNorthEast());
varwidth=Math.abs(c2.x-c1.x);
varheight=Math.abs(c2.y-c1.y);
varleft=Math.min(c2.x,c1.x);
vartop=Math.min(c2.y,c1.y);

//NowpositionourDIVbasedontheDIVcoordinatesofourbounds

this.div_.style.width=width+"px";
this.div_.style.height=height+"px";
this.div_.style.left=left+"px";
this.div_.style.top=top+"px";
}

下面列出一些Googlemapapi的参考站点：

http://econym.org.uk/gmap/

http://maps.forum.nu/
http://koti.mbnet.fi/ojalesa/exam/index.html