Настройте 3D-карты

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

Благодаря облачным инструментам стилизации карт вы можете контролировать внешний вид карты, которую показываете пользователям. Управляя такими параметрами, как плотность точек интереса (POI), удаление определенных категорий POI, а также изменение заливки или обводки объектов, вы можете создать карту, адаптированную под потребности ваших пользователей.

Облачное стилирование карт обеспечивает редактирование без написания кода в консоли Google Cloud. Каждому созданному вами пользовательскому стилю присваивается идентификатор карты; изменения, внесенные в ваш стиль в консоли карт, будут автоматически отображаться в вашем приложении.

В следующем примере показана карта, на которой используется пользовательский стиль для изменения цвета значков и текста, обозначающих зоны отдыха, на оранжевый: 

async function init() {
    const { Map3DElement } = await google.maps.importLibrary('maps3d');

    const map = new Map3DElement({
        center: {
            lat: 37.75183154601466,
            lng: -119.52369070507672,
            altitude: 2200,
        },
        tilt: 67.5,
        heading: 108.94057782079429,
        range: 6605.57279990986,
        mapId: 'bcce776b92de1336e22c569f', // Styles are associated with map IDs.
        mode: 'HYBRID',
        gestureHandling: 'COOPERATIVE',
    });

    document.body.append(map);
}

void init();

Обзор

Процесс настройки 3D-карт с использованием облачных инструментов стилизации аналогичен процессу настройки 2D-карт:

1 Создать идентификатор карты Создайте идентификатор карты (Map ID ). Идентификаторы карт передаются в ваше приложение для управления стилями. На последующих шагах вы свяжете пользовательский стиль с этим идентификатором карты.
2 Создайте стиль карты на основе облачных технологий. На этом этапе необходимо выбрать "3D Hybrid" и использовать "режим освещения".
3 Сопоставьте стиль вашей карты с самой картой. Свяжите свой стиль с идентификатором карты, который вы создали на первом шаге.
4 Добавьте идентификатор карты в ваше приложение. Укажите идентификатор карты в своем коде, используя параметр map-id .
5 Publish the map ID Обратите внимание, что изменения в вашем пользовательском стиле автоматически вносятся в приложение после публикации.

Для более подробного ознакомления с созданием стилей карт ознакомьтесь с разделом «Создание и использование стилей карт» .

Ограничения

При использовании облачных методов стилизации карт с 3D-картами в Maps JavaScript следует учитывать определенные ограничения:

  • Темный режим не поддерживается.
  • Функции, использующие идентификаторы карт, такие как стилизация на основе данных, не поддерживаются.