首页 > 代码库 > 谷歌地图接口,实现点击标记获取经纬度等信息。

谷歌地图接口,实现点击标记获取经纬度等信息。

 

Google map apiAuthor chenbinDate 12/12Email bingoPureLife@gmail.com标记在地图上的位置 并且获取当前位置的经纬度<!DOCTYPE html><html><head>    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>    <title>Google Maps Demo</title>    <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>    <script type="text/javascript">        var infowindow,marker;        var geocoder = new google.maps.Geocoder();        function initialize() {            //var point = new google.maps.LatLng(18.252847, 109.511909);            var point; // 地图中心            if(navigator.geolocation) {                navigator.geolocation.getCurrentPosition(function(position) {                    point = new google.maps.LatLng(                            position.coords.latitude,                            position.coords.longitude                    );                    var myOptions = {                        zoom: 15, // 缩放级别                        center: point,                        mapTypeId: google.maps.MapTypeId.ROADMAP, // 显示普通的街道地图                        mapTypeControl: false, // 地图类型控件                        overviewMapControl: false, // 总览图控件                        scaleControl: false, // 比例控件                        streetViewControl: false // 街景视图                    };                    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);                    //添加地图标记                    marker = new google.maps.Marker({                        position: point,                        map: map                    });                    marker.setDraggable(true); // 设置可拖拽                    //初始化信息窗口                    infowindow = new google.maps.InfoWindow({                        content: "",                        size: new google.maps.Size(50,50)                    });                    //添加拖动监听事件                    google.maps.event.addListener(marker, ‘dragend‘, function(){                        showAddress(map, marker);                    });                    //添加点击监听事件                    google.maps.event.addListener(map, ‘click‘, function(e) {                        clickMou(map,marker,e.latLng);                    });                    showAddress(map,marker);                }, function() {                    handleNoGeolocation(true);                });            } else {                // Browser doesn‘t support Geolocation                handleNoGeolocation(false);            }        }        function handleNoGeolocation(errorFlag) {            if (!errorFlag) {                point = new google.maps.LatLng(32.060255, 118.796877);            }        }        function showAddress(map, marker)        {            var latlng = marker.getPosition();            geocoder = new google.maps.Geocoder();            //根据经纬度获取地址信息            geocoder.geocode({‘latLng‘: latlng}, function(results, status) {                if (status == google.maps.GeocoderStatus.OK) {                    if (results[1]) {                        var address = results[1].formatted_address + "<br />";                        address = results[0].formatted_address + "<br />";                        address += "纬度:" + latlng.lat() + "<br />";                        address += "经度:" + latlng.lng();                        infowindow.setContent(address);                        infowindow.open(map, marker);                    }                } else {                    alert("Geocoder failed due to: " + status);                }            });        }        function clickMou(map, marker,loc)        {            marker.setPosition(loc)            //根据经纬度获取地址信息            geocoder.geocode({‘latLng‘: loc}, function(results, status) {                if (status == google.maps.GeocoderStatus.OK) {                    if (results[1]) {                        var address = results[1].formatted_address + "<br />";                        address = results[0].formatted_address + "<br />";                        address += "纬度:" + loc.lat() + "<br />";                        address += "经度:" + loc.lng();                        infowindow.setContent(address);                        infowindow.open(map, marker);                    }                } else {                    alert("Geocoder failed due to: " + status);                }            });        }    </script></head><body onl oad="initialize()"><div id="map_canvas" style="width: 600px; height: 400px"></div></body></html>

  

谷歌地图接口,实现点击标记获取经纬度等信息。