`
wjm901215
  • 浏览: 148787 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

Google Map API 基本使用方法

    博客分类:
  • MAP
 
阅读更多

方法说明:
   1、GBrowserIsCompatible() -- 是否支持Google Map API
   2、shopLat -- 酒店的经度坐标,
      shopLng -- 酒店的纬度坐标 
   3、new GLatLng(shopLat, shopLng) -- 设置经纬度
   4、map.setCenter(new GLatLng(shopLat, shopLng), 14) -- 设置地图默认的中心点经纬度 
      参数说明: 
      new GLatLng(shopLat, shopLng) -- 设置中心点的经纬度
      14 -- 地图的默认缩放比例大小值,范围为1 - 18
   5、new GMap2(document.getElementById("shopgooglemap")) -- 获取显示的地图容器
   6、map.setMapType(G_NORMAL_MAP); -- 设置显示地图的类型
      可选值:
      1. G_NORMAL_MAP -- 默认地图样式
      2. G_SATELLITE_MAP -- Google Earth 卫星地图
      3. G_HYBRID_MAP -- 混合模式地图
   7、new GIcon(G_DEFAULT_ICON) -- 设置标记样式
   8、addControl() -- 给地图添加控件
      常用的可选控件:
      1. new GLargeMapControl() -- 大的地图缩放级别控件
      2. new GOverviewMapControl() -- 地图缩略图控件  
      3. new GScaleControl() -- 比例尺控件
      4. new GMapTypeControl() -- 地图类形选择控件
   9、enableDoubleClickZoom() -- 双击(鼠标右键)放大/(鼠标左键)缩小地图比例
  10、map.enableScrollWheelZoom() -- 滚动滑轮方法(向前)放大/(向后)缩小地图比例
  11、enableContinuousZoom() -- 允许连贯改变地图比例
  12、createMarker(latlng) -- 自定义方法:
      方法说明:
      new GMarker(latlng) -- 在地图中设置标签,参数latlng -- 标签的坐标
      Event.addListener(marker,event,function) -- 给标签设置事件 
      参数说明:
      marker -- 标签对象,
      event -- 事件名称
      function -- 时间的处理函数
      openInfoWindowHtml(latlng, myHtml) -- 将信息框添加到标签上
      参数说明:
      latlng -- 标签坐标,
      myHtml -- 提示信息的HTML字符串
===============================================================================  
获取地图中心坐标:javascript:void(prompt('中心坐标',gApplication.getMap().getCenter()));        
===============================================================================

 

 

function initMap(){ 
    if(GBrowserIsCompatible()){ 
         var shopLat=message[0][0]; 
         var shopLng=message[0][1]; 
          
         var map = new GMap2(document.getElementById("shopgooglemap")); 
         map.setCenter(new GLatLng(shopLat, shopLng), 14); 
              
         function createMarker(latlng){ 
            var marker = new GMarker(latlng); 
                marker.value=0; 
             
            GEvent.addListener(marker,"click", function(){ 
                var myHtml = "<span id=\"shopInfo\">"; 
                    myHtml += "<h2>" + message[1][0] + "</h2><br />"  
                for(var j=1;j<message[1].length;j++){ 
                    myHtml += message[1][j]+"<br />"; 
                }  
                    myHtml +="</span>"; 
                map.openInfoWindowHtml(latlng, myHtml); 
                } 
            ); 
            return marker; 
         } 

         var point = new GLatLng(shopLat,shopLng); 
         map.addOverlay(createMarker(point)); 
          
         map.enableDoubleClickZoom(); 
         map.enableScrollWheelZoom();  
         map.enableContinuousZoom();  
         
         map.addControl(new GLargeMapControl()) 
         map.addControl(new GOverviewMapControl()); 
         map.addControl(new GScaleControl());   
    } 
    else{ 
        alert("对不起,您的浏览器不支持创建地图!")     
    } 
}

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics