使用GMarker()地标

转自： http://kingx67.javaeye.com/blog/496008

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >  
< html  xmlns ="http://www.w3.org/1999/xhtml" >  
   < head >  
     < meta  http-equiv ="content-type"  content ="text/html; charset=utf-8" />  
< title > Google Maps JavaScript API Example </ title >  
<!-- 导入Google Maps API库文件。注意将本代码中的API Key替换为前文申请到的API Key -->  
     < script  src ="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA1j86tnUDFv8OAtC8dZVtKRT8YXSkg32FmSueYimfV_yj5DJguRRW5eQHwEBk10jwkDxLKNltT_kuQA"  type ="text/javascript" ></ script >  
< script  type ="text/javascript" >  
// <![CDATA[ 
     var  map; 
     // 添加GControl()控件 
     function  load() { 
       if  (GBrowserIsCompatible()) {  
        map  =   new  GMap2(document.getElementById( " map " )); 
        map.addControl( new  GSmallMapControl()); 
        map.addControl( new  GMapTypeControl()); 
        
         // 在此把GLatLng()对象赋值给变量geoPoint0，方便多次使用 
         var  geoPoint0 =   new  GLatLng( 39.92 ,  116.46 ); 
        map.setCenter(geoPoint0,  2 ); 
        
         // 创建GMarker对象 
         var  marker0  =   new  GMarker(geoPoint0); 
         // 在地图上为marker0添加涂层，显示marker0 
        map.addOverlay(marker0); 
      } 
    } 
     // ]]> 
     </ script >  
   </ head >  
   <!-- 加载时调用load()函数加载地图，注意加上οnunlοad="GUnload()"防止内存泄露 -->  
   < body  onload ="load()"  onunload ="GUnload()" >  
     <!-- 以下id为map的DIV元素即为Google地图的容器 -->  
     < div  id ="map"  style ="width: 500px; height: 300px" ></ div >  
   </ body >  
</ html >  

---------------------------------------------------------------------- 
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >  
< html  xmlns ="http://www.w3.org/1999/xhtml" >  
   < head >  
     < meta  http-equiv ="content-type"  content ="text/html; charset=utf-8" />  
< title > Google Maps JavaScript API Example </ title >  
<!-- 导入Google Maps API库文件。注意将本代码中的API Key替换为前文申请到的API Key -->  
     < script  src ="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA1j86tnUDFv8OAtC8dZVtKRT8YXSkg32FmSueYimfV_yj5DJguRRW5eQHwEBk10jwkDxLKNltT_kuQA"  type ="text/javascript" ></ script >  
< script  type ="text/javascript" >  
// <![CDATA[ 
     var  map; 
    
     // 创建一个自定义的GIcon 
     var  myIcon =   new  GIcon(); 
     // 前景图片 
    myIcon.image  =   " http://labs.google.com/ridefinder/images/mm_20_green.png " ; 
     // 阴影图片 
    myIcon.shadow  =   " http://labs.google.com/ridefinder/images/mm_20_shadow.png " ; 
     // 前景图片大小，长x宽 
    myIcon.iconSize  =   new  GSize( 12 ,  20 ); 
     // 阴影图片大小，长x宽 
    myIcon.shadowSize  =   new  GSize( 12 ,  20 ); 
    
     // 以下两个属性很难解释，读者可自行调整其数值以便理解其意义 
     //  myIcon锚定点相对于myIcon图片左上角的像素距离 
    myIcon.iconAnchor  =   new  GPoint( 6 ,  10 ); 
     // 信息窗口相对于myIcon图片左上角的像素距离 
     // 关于信息窗口会在以后介绍 
    myIcon.infoWindowAnchor  =   new  GPoint( 5 ,  1 ); 
    
     function  load() { 
       if  (GBrowserIsCompatible()) {  
        map  =   new  GMap2(document.getElementById( " map " )); 
        map.addControl( new  GSmallMapControl()); 
        map.addControl( new  GMapTypeControl()); 
        
         var  geoPoint0 =   new  GLatLng( 39.92 ,  116.46 ); 
         var  geoPoint1 =   new  GLatLng( 49.92 ,  86.46 ); // 创建另一个地理坐标geoPoint1 

        map.setCenter(geoPoint0,  2 ); 
        
         var  marker0  =   new  GMarker(geoPoint0, {title:  " 我有titile了 " }); 
         var  marker1  =   new  GMarker(geoPoint1, // 创建自定义的GMarker 
                                {icon: myIcon, 
                                 title:  " 把鼠标移上来，看看有什么 " }); 
        map.addOverlay(marker0); 
         // 显示自定义了图标的地标对象marker1 
        map.addOverlay(marker1); 
      } 
    } 
     // ]]> 
     </ script >  
   </ head >  
   <!-- 加载时调用load()函数加载地图，注意加上οnunlοad="GUnload()"防止内存泄露 -->  
   < body  onload ="load()"  onunload ="GUnload()" >  
     <!-- 以下id为map的DIV元素即为Google地图的容器 -->  
     < div  id ="map"  style ="width: 500px; height: 300px" ></ div >  
   </ body >  
</ html >