2010-11-06 18 views
6

Estoy completamente desconcertado aquí. Tengo una lista de objetos que contienen una ubicación. Busco esta ubicación usando google.maps.geocoder y luego pongo un marcador para esa ubicación en un mapa.Google Maps geocodificación y marcadores en el bucle

Pero por alguna razón solo aparece un marcador. Supongo que esto tiene que ver con el problema de cierres que he visto en otros hilos por aquí, pero parece que no puedo aplicar la solución a lo que tengo.

Mi código es el siguiente:

var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
    map.fitBounds(bounds); 

    for (var item in list) { 
    var geocoder = new google.maps.Geocoder(); 
    var geoOptions = { 
     address: item.location, 
     bounds: bounds, 
     region: "NO" 
    }; 
    geocoder.geocode(geoOptions, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
     addMarker(map, item, results[0].geometry.location); 
     } else { 
     console.log("Geocode failed " + status); 
     } 
    }); 
    } 

function addMarker(map, item, location) { 
    var marker = new google.maps.Marker({ map : map, position : location}); 
    marker.setTitle(item.title); 
    var infowindow = new google.maps.InfoWindow({ 
    content : item.body, 
    size : new google.maps.Size(100, 300) 
    }); 
    (function(map, marker) { 
    new google.maps.event.addListener(marker, "click", function() { 
     infowindow.open(map, marker); 
    }); 
    })(map, marker); 
    } 

Cualquier ayuda se agradece.

Actualización: Para evitar cierres de bucles como se sugiere en la primera respuesta, me han cambiado el código para esto:

//This is the entry 
function codeLocations(list, map) { 
    for (var i = 0; i < list.length; i++) { 
    console.log("Looping " + list[i].location); 
    var geocoder = new google.maps.Geocoder(); 
    var geoOptions = { 
     address: list[i].location, 
     bounds: getBounds(), 
     region: "NO" 
    }; 
    geocoder.geocode(geoOptions, createGeocodeCallback(list[i], map)); 
    } 
} 

function createGeocodeCallback(item, map) { 
    console.log("Generating geocode callback for " + item.location); 
    return function(results, status) { 
    if (status == google.maps.GeocoderStatus.OK) { 
     console.log("Geocoding " + item.location + " OK"); 
     addMarker(map, item, results[0].geometry.location); 
    } else { 
     console.log("Geocode failed " + status); 
    } 
    } 
} 

function addMarker(map, item, location) { 
    console.log("Setting marker for " + item.location + " (location: " + location + ")"); 
    var marker = new google.maps.Marker({ map : map, position : location}); 
    marker.setTitle(item.title); 
    var infowindow = new google.maps.InfoWindow({ 
    content : item.body, 
    size : new google.maps.Size(100, 300) 
    }); 
    new google.maps.event.addListener(marker, "click", function() { 
    infowindow.open(map, marker); 
    }); 
} 

De acuerdo con las declaraciones de registro, ahora tengo los objetos correctos en los lugares correctos , lo que significa que los objetos y los objetos de ubicación son diferentes para cada vez que se establece el marcador, pero solo obtengo un marcador en mi mapa. ¿Cómo puede ser esto?

Respuesta

8

No cree cierres en bucles. That just won't work. Esta podría ser una solución para el problema:

function callback() { 
    return function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
     addMarker(map, item, results[0].geometry.location); 
     } else { 
     console.log("Geocode failed " + status); 
     } 
    }; 
    } 

    for (var item in list) { 
    var geocoder = new google.maps.Geocoder(); 
    var geoOptions = { 
     address: item.location, 
     bounds: bounds, 
     region: "NO" 
    }; 
    geocoder.geocode(geoOptions, callback()); 
    } 
+0

Gracias por eso. He actualizado el código para evitar eso, pero parece que no soluciona el problema: -/ – fiskeben

+0

@fiskeben, ¿puede darnos un ejemplo en línea, es mucho más fácil de depurar? – Harmen

+0

Claro, intente http: // riccomadsen. com/maptest.html – fiskeben

Cuestiones relacionadas