2014-01-28 4 views
3

им новые для Google Maps API и сделали Геокодировать пример на:Google Maps Геокодирование строки

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> 

Это, вероятно, что-то простое, но, как я сказал им новое для Google Maps и 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> 
Смежные вопросы