Облачные стили карт

На платформе Google Карт есть облачные функции для работы со стилями, позволяющие с легкостью настраивать стили карт и управлять ими с помощью Google Cloud Console, чтобы делать карты удобнее для пользователей, не обновляя код приложений после каждого изменения стиля.

Стили, созданные до 15 сентября 2020 г., не поддерживают улучшенное отображение природных объектов. Если вы хотите использовать такие объекты, создайте новый стиль карты.

Облачные стили карт позволяют создавать и изменять стили для любых приложений, в которых используются Google Карты, без внесения изменений в код после добавления идентификатора карты. Все изменения стилей осуществляются в Cloud Console без какого-либо кодирования. Можно изменять вид и цвет множества элементов карты, таких как дороги, здания, водные объекты, объекты инфраструктуры и транзитные маршруты.

Доступны следующие функции:

• Облачные стили. Вы можете работать с внешним видом динамических и статических карт в Cloud Console, используя идентификаторы и стили карт. Вносить изменения в код JSON не потребуется.
• Векторная карта. Разработчики JavaScript могут выбрать и встроить в приложения ту же самую векторную карту на базе WebGL, что доступна на сайте maps.google.com.
• Фильтрация бизнес-объектов. Все объекты разделены на пять категорий, которые можно показывать или не показывать на карте.
• Настройки плотности объектов. Вы можете указать, какой должна быть плотность объектов на базовой карте по умолчанию.

Облачные стили карт доступны в Maps SDK для Android¹, Maps SDK для iOS, JavaScript и Maps Static API. Однако не все функции доступны на всех платформах.

Подготовка

• Создайте идентификатор карты
  Чтобы использовать облачные стили, карту необходимо загружать с использованием идентификатора карты.
• Откажитесь от стилей, заданных в коде
  Прежде чем добавлять идентификатор карты для использования облачного стиля на существующей карте со стилем, заданным в коде, например JSON или параметрами запроса URL, рекомендуется удалить заданный в коде стиль, чтобы избежать возможных конфликтов с будущими функциями. Можно импортировать стилизацию JSON в новый стиль карты.
  • Для Android обновите MapStyleOptions
  • Для iOS обновите класс GMSMapStyle
  • Для JavaScript удалите стилизацию MapTypeStyle
  • Для Maps Static удалите параметр style

Оплата

Для использования облачных стилей карт требуется идентификатор карты. Использование идентификатора карты в Maps SDK для Android, Maps SDK для iOS или JavaScript требует оплаты по коду Dynamic Maps. Использование идентификатора карты в Maps Static API требует оплаты по коду Static Maps.

Примеры

Ниже показан базовый пример загрузки стилизованной карты по ее ID. Maps JavaScript при загрузке карты ссылается на ID 8e0a97af9386fef и автоматически применяет связанный с этим идентификатором стиль карты.

function initMap(): void {
  new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      mapId: "8e0a97af9386fef",
      center: { lat: 48.85, lng: 2.35 },
      zoom: 12,
    } as google.maps.MapOptions
  );
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;
index.ts

function initMap() {
  new google.maps.Map(document.getElementById("map"), {
    mapId: "8e0a97af9386fef",
    center: { lat: 48.85, lng: 2.35 },
    zoom: 12,
  });
}

window.initMap = initMap;
index.js