Несколько маркеров на google maps v3 не работают в цикле

Question

Хорошо, парни и девушки, у меня возникли проблемы с добавлением нескольких маркеров. Клянусь, я искал, пока мои глаза не пересекались, и я просто не могу понять это.

Вот мой код:

function initialize() 
{ 
cnt = 0; 

var icon = "bullet-red-icon.png"; 

var mapProp = { 
    center: new google.maps.LatLng(39.8282,-98.5795), 
    zoom:5, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}; 

var map = new google.maps.Map(document.getElementById("googleMap"), mapProp); 

$("marker", mapxml).each(
    function(i) 
    { 
     var iwcontent = $(this).find("mname").text() + "<br /><br />"; 
     iwcontent += $(this).find("mstreet").text() + "<br />" + $(this).find("mcity").text() + " " + $(this).find("mstate").text() + " " + $(this).find("mzip").text() + "<br /><br />"; 
     iwcontent += "UNITS: " + $(this).find("units").text() + "<br />"; 
     iwcontent += "UNIT COST: " + $(this).find("unitcost").text() + "<br />"; 
     iwcontent += "TOTAL FUEL COST: " + $(this).find("fuelcost").text() + "<br />"; 

     var mlat = parseFloat($(this).find("mlat").text()); 
     var mlon = parseFloat($(this).find("mlon").text()); 

     addMarker(iwcontent, mlat, mlon, map, i); 
    } 
); 

$("#d_transmap").show(); 
$(".t_loader").hide(); 

} 

Теперь я знаю, что все данные есть, я console.logged все, и все кажется нормально. Однако маркеров вообще нет.

Вот функция addMarker:

function addMarker(content, lat, lon, map, i) 
{ 
    var point = new google.maps.LatLng(lat, lon.toFixed(6)); 
    var marker = new google.maps.Marker({ position: point, icon: "bullet-red-icon.png", map: map }); 
    var infowindow = new google.maps.InfoWindow({ content: content }); 
    google.maps.event.addListener(marker, 'click', (function(marker, i) { 
     return function() { 
      infowindow.setContent(content); 
      infowindow.open(map, marker); 
     } 
    })(marker, i)); 
} 

Теперь, если я иду за пределы цикла и называем это:

addMarker(content, 39.8282, -98.5795, map, i) 

Он выложит маркер! Поэтому моя первоначальная мысль была чем-то неправильным с моими длинными данными. Однако я зарегистрировал все эти данные и даже сам зарегистрировал маркеры, и они, похоже, создают их. Я просто их не вижу.

В чем я ошибаюсь?

Answer 1

использование ниже коды для нескольких маркеров переменной обр является массивом широчайшего длинного значения

function initialize(arr) { 

    directionsDisplay = new google.maps.DirectionsRenderer(); 
    geocoder = new google.maps.Geocoder(); 

    var mapOptions = {  
    }; 

    var icon = "bullet-red-icon.png"; 
    map = new google.maps.Map(document.getElementById('map_addresses'),mapOptions); 

    jQuery(arr).each(function(i){ 
    if(typeof arr[i] != 'undefined'){ 
     var latlng = new google.maps.LatLng(arr[i][0],arr[i][1]); 
      geocoder.geocode(
       {'latLng': latlng}, 
       function(results, status) { 
       if (status == google.maps.GeocoderStatus.OK) { 
        bounds.extend(results[0].geometry.location); 
        map.fitBounds(bounds); 

        marker = new google.maps.Marker({ 
        map: map, 
        position: results[0].geometry.location, 
        icon: icon , 
        animation: google.maps.Animation.DROP, 
        }); 
        //google.maps.event.addListener(marker, 'click', toggleBounce); 
        markersArray.push(marker); 
       } else { 
        alert('Geocode was not successful for the following reason: ' 
        + status); 
       } 
       } 
     ); 
    } 
    }); 
} 
google.maps.event.addDomListener(window, 'load', initialize); 

надеется, что это поможет вам

Answer 2

Вашей addMarker() функции имеет несколько проблем.

1. Звонок на lon.toFixed(6) не должен быть там. Просто используйте lon напрямую. Также я предлагаю использовать имя lng вместо lon для соответствия терминологии API Карт.
2. Вам не нужна модная песня и танец с функцией-возвратом-функцией для прослушивателя событий щелчка. У вас уже есть закрытие, потому что addMarker() - это функция. Вам не нужно еще одно закрытие. И вам не нужен параметр i. Это не мешает вашему коду работать, но вам нужно много дополнительного усложнения.

function addMarker(content, lat, lng, map) { 
    var point = new google.maps.LatLng(lat, lng); 
    var marker = new google.maps.Marker({ 
     position: point, 
     icon: "bullet-red-icon.png", 
     map: map 
    }); 
    var infowindow = new google.maps.InfoWindow({ content: content }); 
    google.maps.event.addListener(marker, 'click', function() { 
     infowindow.setContent(content); 
     infowindow.open(map, marker); 
    }); 
} 

Update: Zoom весь путь в вашей тестовой страницы, так что вы можете увидеть Антарктиду. Нашли свои отсутствующие маркеры? :-)

(Update 2: Ну, иногда я вижу маркеры там и иногда я не Но продолжайте читать ....)

Теперь проверить широту и долготу в вашем XML скачать, например, :

<mlat>-82.753936</mlat> 
<mlon>42.675168</mlon>