首页 > 代码库 > 谷歌地图接口,实现点击标记获取经纬度等信息。
谷歌地图接口,实现点击标记获取经纬度等信息。
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>
谷歌地图接口,实现点击标记获取经纬度等信息。
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。