Question

I have the following code to display markers on a google map based upon an array of locations, however I have a mix of postcodes and Lat/longs, I've used the geocoder to convert the postcodes to lat/longs but can't then use them when I try and set a marker.

Thanks for any help!

var geocoder;  
var map;  
var pos;  
var geoLat;  
var geoLong;  
var markers = [];  
var bounds = new google.maps.LatLngBounds();  
var locations = [  
    [null, 'London Eye, London', 51.503454,-0.119562, 4]  
    ,[null, 'Palace of Westminster, London', 51.499633,-0.124755]  
    ,[null, 'The London Dungeon', 'SE1 7PB', ,  2]  //Value with Postcode
];  

function isNumber(o) { return ! isNaN (o-0) && o !== null && o !== "" && o !== false; }  

function init() {  
  geocoder = new google.maps.Geocoder();  
  var num_markers = locations.length;  

  map = new google.maps.Map(document.getElementById('map_canvas'), {  
    zoom: 10,  
    center: new google.maps.LatLng(locations[0][2], locations[0][3]),  
    mapTypeId: google.maps.MapTypeId.ROADMAP   
  });  

  for (var i = 0; i < num_markers; i++) {  
    if (isNumber (locations[i][2]) && isNumber (locations[i][3])){  
      geoLat = locations[i][2]  
      geoLng  = locations[i][3]  
      alert(typeof(geoLat) +' '+typeof(geoLng))  //generates a correct  number number response
    }else{  
      geocoder.geocode( { 'address': locations[i][2]}, function(results, status) {  
        if (status == google.maps.GeocoderStatus.OK) {  
          geoLat = results[0].geometry.location.lat()  
          geoLng = results[0].geometry.location.lng()  
          alert(typeof(geoLat) +' '+typeof(geoLng))   //generates a correct  number number response 
        }  
      });  
    }  

    pos = new google.maps.LatLng(geoLat, geoLng);  // Doesn't get value if a geocodes postcode added in
    bounds.extend(pos);  
    map.fitBounds(bounds);  

    markers[i] = new google.maps.Marker({  
      position: pos,  
      map: map,  
      id: i,  
      title: locations[i][1]  
    });  
  }  
}  

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

Answer 1

Geolocation请求是异步调用，这意味着当API请求尚未完成时，您的脚本正在运行。因此，您有两种选择。

直接在回调函数中定义标记

 if (status == google.maps.GeocoderStatus.OK) {  }

或者写一下......像setMarker（）函数一样，并在回调中调用它。

function setMarker(lat, lng){}

一般来说，将地理编码请求设为函数也是一种好习惯，例如：

doGeocode: function (address, postal_code, callback) {
    console.log("TEST: " + address.toString());
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({
        'address': address,
        'componentRestrictions': {
            'postalCode': postal_code,
            'country': 'de'
        }
    }, function (results, status) {
        if (status === google.maps.GeocoderStatus.OK) {
            console.log(results);
            callback(results);
        } else {
            //Error handling
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });

如果您现在想要调用它，只需执行

doGeocode (adress, postal_code, function (response){

 //do your stuff
)};

Google maps - either lat and long or postcode

1 个答案: