Google Maps API: Открытие URL при клике на маркер

В классе Marker действительно нет свойства url. Тем не менее, ничего не мешает вам добавить это свойство самостоятельно. Из вашего вопроса следует, что вы, вероятно, смотрели пример, который делал что-то подобное. Вам нужно использовать разные URL для каждого маркера? В приведённом вами коде вы можете заметить, что допустили небольшую ошибку. Когда вы добавляете url как свойство маркера, оно будет доступно в обработчике события клика, но, так как вы используете анонимную функцию, this будет ссылаться на глобальный объект (или будет undefined в строгом режиме). Для передачи контекста вы можете использовать метод .bind() или сохранять контекст в замыкании.

Попробуйте следующим образом:

for (var i = 0; i < locations.length; i++) 
{
    var flag = new google.maps.MarkerImage('markers/' + (i + 1) + '.png',
      new google.maps.Size(17, 19),
      new google.maps.Point(0,0),
      new google.maps.Point(0, 19));
    var place = locations[i];
    var myLatLng = new google.maps.LatLng(place[1], place[2]);
    
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        icon: flag,
        shape: shape,
        title: place[0],
        zIndex: place[3],
        url: "/your/url/" + i // или любое другое значение, зависит от ваших потребностей
    });

    // Используем замыкание для сохранения контекста
    (function(marker) {
        google.maps.event.addListener(marker, 'click', function() {
            window.location.href = marker.url;
        });
    })(marker);
}

Таким образом, вы однонаправленно сохраняете контекст каждого маркера и можете корректно использовать его URL в обработчике события.

В вашем коде используется метод addListener для добавления обработчика события клика на маркер. При нажатии на маркер будет выполнена функция, которая перенаправляет пользователя по URL, указанному в свойстве marker.url.

Вот перевод вашего кода на русский:

google.maps.event.addListener(marker, 'click', (function(marker, i) {
  return function() {
    window.location.href = marker.url; // Перенаправление на URL маркера
  }
})(marker, i));

Здесь используется самовызывающаяся функция, в которую передаются два параметра: marker и i. Это позволяет сохранить контекст маркера при вызове обработчика события. Когда пользователь кликает на маркер, происходит перенаправление на адрес, указанный в marker.url.

Если кто-то хочет добавить URL к одному маркеру без использования циклов, вот как это можно сделать:

if ($('#googleMap').length) {
    var initialize = function() {
        var mapOptions = {
            zoom: 15,
            scrollwheel: false,
            center: new google.maps.LatLng(45.725788, -73.5120818),
            styles: [{
                stylers: [{
                    saturation: -100
                }]
            }]
        };
        var map = new google.maps.Map(document.getElementById("googleMap"), mapOptions);
        var marker = new google.maps.Marker({
            position: map.getCenter(),
            animation: google.maps.Animation.BOUNCE,
            icon: 'example-marker.png',
            map: map,
            url: 'https://example.com'
        });

        // Добавляем URL к маркеру
        google.maps.event.addListener(marker, 'click', function() {
            window.location.href = this.url; // Переход по URL при клике на маркер
        });
    }
    // Добавляем функцию инициализации карты к загрузке окна
    google.maps.event.addDomListener(window, "load", initialize);
}

В этом коде мы создаем маркер на карте, к которому прикрепляем URL. При нажатии на маркер происходит переход на указанный адрес, и при этом не требуется использовать циклы.

Ваш код выглядит как часть шаблона для динамического создания маркеров на карте Google. Я вижу, что вы используете цикл для создания маркеров для каждого местоположения из object_list. Однако в вашем коде есть небольшая проблема с обработкой параметра url. Вы не можете использовать {{location.id}} напрямую, так как это строка, и вам нужно правильно заключить её в кавычки.

Вот исправленная версия вашего кода:

function loadMarkers(){
    {% for location in object_list %}
        var point = new google.maps.LatLng({{location.latitude}}, {{location.longitude}});
        var marker = new google.maps.Marker({
            position: point,
            map: map,
            url: '{{ location.id }}',  // Обратите внимание на одинарные кавычки
        });

        google.maps.event.addDomListener(marker, 'click', function() {
            window.location.href = this.url; 
        });
    {% endfor %}
}

Теперь this.url будет корректно указывать на строковое значение, которое вы ожидаете. Убедитесь также, что map и object_list определены ранее в вашем коде. Если у вас возникнут дополнительные вопросы, не стесняйтесь спрашивать!