google地图的调用

来源:互联网 发布:天猫淘宝网创始人是谁? 编辑:程序博客网 时间:2024/05/21 08:40

1、导入<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=ABQIAAAATJNOkxqeA00GvOSvtD0J7hSPUH3lDKqqjr52CcmeDckYX45TwRSiMoT2DgkWcWv6esFBitxTcvfTRw" type="text/javascript"></script>

2、写方法

<script type="text/javascript">
    function init(){
         var map = new GMap2(document.getElementById("mapObj"));//页面地图显示的位置(div中)
         var lat=document.getElementById("entity_longitude");//页面接收经度的input (ID为entity_longitude)
           var lng=document.getElementById("entity_dimensions");//页面接收纬度的input (ID为entity_dimensions)
        map.clearOverlays();
        map.removeMapType(G_HYBRID_MAP);
        map.addControl(new GLargeMapControl());//控制方向
        //map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
       
           var marker ;
           if (lat.value&&lng.value){
           marker = new GMarker(new GLatLng(lat.value,lng.value));//锚点位置
           map.addOverlay(marker);
           }
         GEvent.addListener(map, "click", function(overlay,latlng) {
            map.clearOverlays();
               if(latlng){
                    marker=new GMarker(latlng);
                   map.addOverlay(marker,true);
                   lat.value=latlng.lat();
                   lng.value=latlng.lng();    
               }
             });
            map.setCenter(new GLatLng(lat.value,lng.value), 13);
      }
</script>

3、页面调用和显示位置

 <input type="text" id="entity_longitude"/>

 <input type="text" id="entity_dimensions"/>

<div class="mapbox" id="mapObj">
    
      </div>

<script type="text/javascript">
    init();
    </script>

 

详细的情况可以google:搜索 google map API 。

原创粉丝点击