maurobaraldi

Reverse Geocoding Google Maps API

Oct 29th, 2012
87
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 2.04 KB | None | 0 0
  1.  
  2. <!DOCTYPE html>
  3. <html>
  4.   <head>
  5.     <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  6.     <meta charset="utf-8">
  7.     <title>Google Maps JavaScript API v3 Example: Reverse Geocoding</title>
  8.     <link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
  9.     <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
  10.     <script>
  11.       var geocoder;
  12.       var map;
  13.       var infowindow = new google.maps.InfoWindow();
  14.       var marker;
  15.       function initialize() {
  16.         geocoder = new google.maps.Geocoder();
  17.         var latlng = new google.maps.LatLng(40.730885,-73.997383);
  18.         var mapOptions = {
  19.           zoom: 8,
  20.           center: latlng,
  21.           mapTypeId: 'roadmap'
  22.         }
  23.         map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
  24.       }
  25.  
  26.       function codeLatLng() {
  27.         var input = document.getElementById('latlng').value;
  28.         var latlngStr = input.split(',', 2);
  29.         var lat = parseFloat(latlngStr[0]);
  30.         var lng = parseFloat(latlngStr[1]);
  31.         var latlng = new google.maps.LatLng(lat, lng);
  32.         geocoder.geocode({'latLng': latlng}, function(results, status) {
  33.           if (status == google.maps.GeocoderStatus.OK) {
  34.             if (results[1]) {
  35.               map.setZoom(11);
  36.               marker = new google.maps.Marker({
  37.                   position: latlng,
  38.                   map: map
  39.               });
  40.               infowindow.setContent(results[1].formatted_address);
  41.               infowindow.open(map, marker);
  42.             } else {
  43.               alert('No results found');
  44.             }
  45.           } else {
  46.             alert('Geocoder failed due to: ' + status);
  47.           }
  48.         });
  49.       }
  50.     </script>
  51.   </head>
  52.   <body onload="initialize()">
  53.     <div>
  54.       <input id="latlng" type="textbox" value="40.714224,-73.961452">
  55.     </div>
  56.     <div>
  57.       <input type="button" value="Reverse Geocode" onclick="codeLatLng()">
  58.     </div>
  59.     <div id="map_canvas" style="height: 90%; top:60px; border: 1px solid black;"></div>
  60.   </body>
  61. </html>
Add Comment
Please, Sign In to add comment