Блог

Я начал перечислять свои маркеры по отдельности для моей карты Google, но быстро понял, что это неэффективно. Я попытался создать массив для размещения маркеров на моей карте, но он ничего не показывает, можете ли вы увидеть, где я ошибся?

 function initialize() {
        var latlng = new google.maps.LatLng(52.474, -1.868);

        var myOptions = {
            zoom: 11,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        var image = 'i/hotel-map-pin.png';

        var hotels = [
            ['ibis Birmingham Airport', 52.452656, -1.730548, 4],
            ['ETAP Birmingham Airport', 52.452527, -1.731644, 3],
            ['ibis Birmingham City Centre', 52.475162, -1.897208, 2]
        ];

        for (var i = 0; i < hotels.length; i  ) {
            var marker = new google.maps.Marker({
                position: hotels[1],
                map: map,
                icon: image,
                title: hotels[0],
                zIndex: hotels[2]
            });
        }
    }
  

Спасибо.

В вашем цикле вы обращаетесь к массиву отелей с фиксированными индексами (1, 0 и 2), а не к элементам массива с индексом i:

   for (var i = 0; i < hotels.length; i  ) {
        var hotel = hotels [i]
        var marker = new google.maps.Marker({
            position: new google.maps.LatLng (hotel[1], hotel[2]),
            map: map,
            icon: image,
            title: hotel[0],
            zIndex: hotel[3]
        });
    }
  

Вот рабочий пример с исправлением.

Вот демонстрация JSFiddle:

Прежде всего, вы неправильно обращаетесь к массиву отелей. Это должно быть hotels[i][0] для заголовка hotels[i][1] , hotels[i][2] для широты и lng и hotels[i][3] для z-индекса. Во-вторых, position принимает google.maps.LatLng объект с широтой и lng в качестве параметра.

 function initialize() {
    var latlng = new google.maps.LatLng(52.474, -1.868);

    var myOptions = {
        zoom: 11,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    var image = 'i/hotel-map-pin.png';

    var hotels = [
        ['ibis Birmingham Airport', 52.452656, -1.730548, 4],
        ['ETAP Birmingham Airport', 52.452527, -1.731644, 3],
        ['ibis Birmingham City Centre', 52.475162, -1.897208, 2]
        ];

     for (var i = 0; i < hotels.length; i  ) {
         var marker = new google.maps.Marker({
             position: new google.maps.LatLng(hotels[i][1], hotels[i][2]),
             map: map,
           //  icon: image,
             title: hotels[i][0],
             zIndex: hotels[i][3]
         });
     }
}

window.onload = initialize;