Используйте маркеры, чтобы привлечь внимание пользователя к определённому месту на карте. В этом руководстве показано, как использовать и настраивать маркеры на 3D-картах. Вы можете управлять формой, размером и цветом маркеров, а также высотой их отображения.
Используйте маркеры для обозначения местоположений на картах. В примере выше показан простой маркер без каких-либо настроек.
Настройте цвет, масштаб и изображение значка
Настройте фон, глиф, цвет границы и размер маркера по умолчанию.
Замените значок маркера по умолчанию на пользовательский ресурс SVG.
Установить высоту маркера
Вы можете задать высоту маркера, вытянув маркер и задав высоту.
Заставьте маркеры реагировать на щелчки и нажатия клавиатуры
Добавьте прослушиватель событий click , чтобы маркер реагировал на щелчки и события клавиатуры.
function initMap() {
const map = new Map3DElement({
center: { lat: 37.4690, lng: -122.1074, altitude: 0 },
tilt: 67.5,
range: 45000,
mode: MapMode.HYBRID
});
const interactiveMarker = new google.maps.marker.Marker3DInteractiveElement({
map,
position: {lat: 37.4239163, lng: -122.0947209},
});
interactiveMarker.addEventListener('gmp-click', (event) => {
// Handle the click event.
// ...
});
}
Установить поведение при столкновении маркеров
Укажите, как маркер должен вести себя при столкновении с другим маркером или меткой на карте.
const marker = new Marker3DElement({
position: {lat, lng},
collisionBehavior: google.maps.CollisionBehavior.REQUIRED
});