2014-01-28 58 views
3

進出口新的Google Maps API和已經做的地理編碼例如:谷歌地圖地理編碼字符串

https://developers.google.com/maps/documentation/javascript/examples/geocoding-simple

我希望能夠在該位置我的代碼中進行地理編碼字符串,並留下一個標記, ,而不是用戶搜索某個位置。 到目前爲止我的代碼是:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <title>Geocoding service</title> 
    <style> 
     html, body, #map-canvas 
     { 
     height: 100%; 
     margin: 0px; 
     padding: 0px 
     } 
    </style> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 
    <script> 
    //global variables 
var geocoder; 
var map; 
var Ireland = "Dublin"; 

function initialize() 
{ 
    geocoder = new google.maps.Geocoder(); 
    var latlng = new google.maps.LatLng(53.3496, -6.3263); 
    var mapOptions = 
    { 
    zoom: 8, 
    center: latlng 
    } 
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
    codeAddress();//call the function 
} 

function codeAddress() 
{ 
    var address = document.getElementById("Ireland").value; 
    geocoder.geocode({"Ireland":address}, function(results, status) 
    { 
    if (status == google.maps.GeocoderStatus.OK) 
    { 
     map.setCenter(results[0].geometry.location);//center the map over the result 
     //place a marker at the location 
     var marker = new google.maps.Marker(
     { 
      map: map, 
      position: results[0].geometry.location 
     }); 
    } else { 
     alert('Geocode was not successful for the following reason: ' + status); 
    } 
    }); 
} 

google.maps.event.addDomListener(window, 'load', initialize); 

    </script> 
    </head> 
    <body> 
    <div id="map-canvas"></div> 
    </body> 
</html> 

這可能是一些簡單的,但正如我所說的進出口新的谷歌地圖和HTML,很想任何幫助都那麼請不要否決。 謝謝

回答

10

這將更改codeAddress函數以採用參數和地理編碼該參數。如果您通過愛爾蘭變量作爲參數,它會將地理編碼「都柏林」。

var Ireland = "Dublin"; 

function initialize() 
{ 
    geocoder = new google.maps.Geocoder(); 
    var latlng = new google.maps.LatLng(53.3496, -6.3263); 
    var mapOptions = 
    { 
    zoom: 8, 
    center: latlng 
    } 
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
    codeAddress(Ireland);//call the function 
} 

function codeAddress(address) 
{ 
    geocoder.geocode({address:address}, function(results, status) 
    { 
    if (status == google.maps.GeocoderStatus.OK) 
    { 
     map.setCenter(results[0].geometry.location);//center the map over the result 
     //place a marker at the location 
     var marker = new google.maps.Marker(
     { 
      map: map, 
      position: results[0].geometry.location 
     }); 
    } else { 
     alert('Geocode was not successful for the following reason: ' + status); 
    } 
    }); 
} 
+0

謝謝你的工作! :) – user3232726

+0

如果它適合你,請[接受它](http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work) – geocodezip

1

試試這個。

<!doctype html> 
    <html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Google Map Address</title> 
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 

    <script type="text/javascript"> 

      var geocoder = new google.maps.Geocoder(); 
    var address = "Dublin"; 

    geocoder.geocode({ 'address': address}, function(results, status) { 

     if (status == google.maps.GeocoderStatus.OK) { 
     var latitude = results[0].geometry.location.lat(); 
     var longitude = results[0].geometry.location.lng(); 


     initialize(latitude,longitude); 

       } 

     }); 


    function initialize(latitude,longitude) { 
     var latlng = new google.maps.LatLng(latitude,longitude); 

     var myOptions = { 
      zoom: 14, 
      center: latlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      mapTypeControl: false 
     }; 
     var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions); 

     var marker = new google.maps.Marker({ 
      position: latlng, 
      map: map, 
      title:"location : Dublin" 
     }); 
     } 


</script> 

    </head> 
    <body> 

    <h2>Google Map Address</h2> 

    <div id="map_canvas" style="width:710px; height:300px"></div> 

      </body> 
    </html>