Чтобы связать свою кнопку с соответствующим маркером на Google Maps, вам потребуется использовать JavaScript API Google Maps.
Первое, что нужно сделать, это создать экземпляр карты и добавить маркер на карту. Вот пример:
// Создаем экземпляр карты var map = new google.maps.Map(document.getElementById('map'), { center: {lat: 51.5074, lng: -0.1278}, zoom: 10 }); // Создаем маркер var marker = new google.maps.Marker({ position: {lat: 51.5074, lng: -0.1278}, map: map, title: 'My Marker' });
В коде выше мы создали карту, которая будет отображать место с координатами (51.5074, -0.1278). Затем мы создали маркер на этом месте с заголовком "My Marker".
Теперь нам нужно связать нашу кнопку с этим маркером. Есть несколько способов сделать это, но один из самых простых - это добавить слушатель событий на кнопку и при нажатии на кнопку переместить карту на место маркера и пометить маркер.
// Находим кнопку var button = document.getElementById('button'); // Добавляем слушатель событий на кнопку button.addEventListener('click', function() { // Перемещаем карту на место маркера map.setCenter(marker.getPosition()); map.setZoom(15); // Помечаем маркер (можно использовать, например, изменение иконки маркера) marker.setIcon('path/to/icon.png'); });
В этом примере мы находим кнопку по ее идентификатору, добавляем слушатель событий на кнопку и при нажатии на кнопку вызываем функцию, которая перемещает карту на место маркера и меняет масштаб карты. Мы также можем изменить иконку маркера, если требуется.
В завершение, убедитесь, что вы добавили карту и кнопку на вашу веб-страницу:
<div id="map"></div> <button id="button">Показать маркер</button>
Это основной пример того, как связать свою кнопку с соответствующим маркером на Google Maps с использованием JavaScript API. Однако, в зависимости от ваших требований, могут потребоваться дополнительные настройки и функциональность, которые могут быть реализованы с помощью других методов и свойств API.