Использовать идентификаторы карты

Идентификатор карты – это уникальный идентификатор, который используется для обозначения отдельного экземпляра карты Google. Вы используете идентификаторы карт, чтобы активировать функции, управлять картами или стилизовать их на своих веб-сайтах и ​​в своих приложениях. Вы можете создать идентификаторы карт для каждой необходимой вам платформы — JavaScript, Android, iOS или статических карт — в своем проекте Google Cloud Console на странице «Управление картами» .

Что можно делать с идентификаторами карт

Используйте идентификаторы карт, чтобы включить функции и стили. Вот несколько примеров использования идентификаторов карт. Полный список см. в разделе «Функции, использующие идентификаторы карт» :

  • Стилизация облачных карт . Свяжите идентификатор карты со стилем карты, чтобы стилизовать, настраивать и управлять своими картами с помощью Google Cloud Console. Доступно на всех платформах: JavaScript , Android , iOS и Maps Static API .

  • Векторные карты . Используйте идентификатор карты, чтобы использовать карту, состоящую из векторных фрагментов, которые рисуются во время загрузки на стороне клиента с помощью WebGL. Доступно на JavaScript .

  • Расширенные маркеры : используйте идентификатор карты, чтобы включить расширенные маркеры. Доступно на JavaScript , Android и iOS .

Пример оформления облачных карт

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

  1. Создайте идентификаторы карт для каждой используемой вами платформы. Например, создайте JavaScript и идентификатор карты Android. Подробности см. в разделе Создание идентификаторов карт .

  2. Настройте стиль карты в Google Cloud Console. Подробности см. в разделе Оформление облачных карт .

  3. Свяжите оба идентификатора карты со стилем карты в Google Cloud Console. Подробности см. в разделе «Связывание идентификаторов карт со своим стилем» .

  4. Укажите идентификатор карты в JavaScript вашего веб-сайта и в коде приложения для Android. Подробную информацию см. в разделе Добавление идентификатора карты в ваше приложение .

Стиль карты, связанный с вашими идентификаторами карт, затем отображается на вашем веб-сайте и в приложении Android. Вы можете обновлять стиль карты в Cloud Console, и изменения появляются в обоих местах автоматически, без необходимости обновления приложений вашими клиентами.

Функции, использующие идентификаторы карт

В следующей таблице показаны функции и API платформы Google Maps, использующие идентификаторы карт:

Функция или API Использует идентификаторы карт для достижения этих целей.
Расширенные маркеры Включите расширенные маркеры. Вам не нужно создавать идентификатор карты, вместо этого вы можете использовать идентификатор демонстрационной карты `DEMO_MAP_ID`.
Управляемое данными моделирование границ Свяжите идентификатор карты с набором границ и стилем, чтобы стилизовать карту в соответствии с границами.
Управляемое данными оформление наборов данных Свяжите идентификатор карты с набором данных и стилем, чтобы стилизовать карту в соответствии с набором данных.
трепетать Создавайте стили для карт Google, используемых в ваших приложениях Flutter.
API для встраивания карт Укажите и стилизуйте карту, которая будет встроена в веб-страницу.
API JavaScript Карт Оформите карту для отображения на веб-странице.
SDK Карт для Android Создайте стиль карты для отображения в приложении Android. 1
SDK Карт для iOS Создайте стиль карты для отображения в приложении iOS. 1
Статический API карт Укажите и стилизуйте карту, которая будет отображаться как статическое изображение.
Мобильные решения Используйте Maps JavaScript API и SDK для Android и iOS для стилизации карт в мобильных решениях. 1
WebGL (векторные карты) Включите функции WebGL, используя идентификатор векторной карты JavaScript.

1 Использование идентификатора карты в Maps SDK для Android или Maps SDK для iOS запускает загрузку карты, которая взимается по номеру SKU динамических карт.

Как создавать и использовать идентификаторы карт

Идентификатор карты – это уникальный идентификатор, представляющий отдельный экземпляр карты Google. Вы создаете идентификаторы карт и обновляете стиль карты, связанный с идентификатором карты, в Cloud Console.

Требуемые разрешения

Чтобы создавать любые идентификаторы карт в вашем проекте или управлять ими, вы должны использовать участника с соответствующими разрешениями уровня роли (редактор или владелец) на странице IAM Cloud Console для проекта. Подробности см. в справочнике по базовым и предопределенным ролям IAM .

Создать идентификаторы карт

Вы можете создавать идентификаторы карт и обновлять стиль, связанный с идентификатором карты, в любое время в Cloud Console.

Чтобы создать идентификатор карты, выполните следующие действия:

  1. Войдите в систему и откройте проект Cloud Console с необходимыми разрешениями .

  2. В Cloud Console перейдите на страницу «Управление картами» .

  3. Выберите Создать идентификатор карты .

    Создать новый идентификатор карты

  4. На странице Создать новый идентификатор карты выполните следующие действия:

    1. В поле Name укажите имя идентификатора карты.
    2. Необязательно : в поле «Описание» укажите, для чего используется идентификатор карты.
    3. В поле «Тип карты» выберите платформу, на которой вы планируете использовать идентификатор карты. Если вы выберете JavaScript, также выберите тип карты «Растровая» (по умолчанию) или «Векторная» . Дополнительную информацию о векторных картах см. в разделе Векторные карты .
    4. Выберите «Сохранить» , чтобы отобразить новый идентификатор карты.

Свяжите идентификатор карты со стилем карты

В этих инструкциях предполагается, что в вашем проекте существует хотя бы один стиль карты. Если у вас нет стилей карт, см. раздел «Стили облачных карт» и выберите свою платформу, чтобы получить инструкции по их созданию.

  1. В Cloud Console перейдите на страницу «Управление картами» .
  2. В таблице выберите существующий идентификатор карты.
  3. В разделе «Связанный стиль карты» выберите стиль карты.

  4. Выберите Сохранить .

    Страница сведений об идентификаторе карты, на которой вы связываете стиль карты.

Добавьте идентификатор карты в свое приложение

Андроид

Добавьте идентификатор карты через элемент <fragment> в файле макета действия, с помощью класса MapView или программно с помощью класса GoogleMapOptions .

Например, предположим, что вы создали идентификатор карты, который хранится в виде строкового значения с именем map_id в res/values/strings.xml :

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="map_id">MAP_ID</string>
</resources>

Для карт, добавленных с помощью элемента <fragment> в файле макета действия, все фрагменты карты, которые должны иметь собственный стиль, должны указывать идентификатор карты в атрибуте map:mapId :

<fragment xmlns:map="http://schemas.android.com/apk/res-auto"
    map:name="com.google.android.gms.maps.SupportMapFragment"
    …
    map:mapId="@string/map_id" />

Вы также можете использовать атрибут map:mapId класса MapView , чтобы указать идентификатор карты:

<com.google.android.gms.maps.MapView
    xmlns:android="http://schemas.android.com/apk/res/android"
    ....
    map:mapId="@string/map_id" />

Чтобы указать идентификатор карты программно, передайте его экземпляру MapFragment с помощью класса GoogleMapOptions :

Ява 

 MapFragment mapFragment = MapFragment.newInstance(
     new GoogleMapOptions()
         .mapId(getResources().getString(R.string.map_id)));

Котлин 

 val mapFragment = MapFragment.newInstance(
     GoogleMapOptions()
         .mapId(resources.getString(R.string.map_id))
 )

В Android Studio создайте и запустите свое приложение, как обычно. Пользовательские стили, настроенные на первом этапе, применяются ко всем картам с указанным идентификатором карты.

iOS

Чтобы создать экземпляр карты с использованием идентификатора карты, выполните следующие действия:

  1. Создайте GMSMapID со строкой идентификатора карты из Cloud Console.
  2. Создайте GMSMapView указав только что созданный идентификатор карты.

Быстрый 

let camera = GMSCameraPosition(latitude: 47.0169, longitude: -122.336471, zoom: 12)
let mapID = GMSMapID(identifier: "MAP_ID")
let mapView = GMSMapView(frame: .zero, mapID: mapID, camera: camera)
self.view = mapView

Цель-C 

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:47.0169
                                                        longitude:-122.336471
                                                             zoom:12];
GMSMapID *mapID = [GMSMapID mapIDWithIdentifier:@"MAP_ID"];
GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero mapID:mapID camera:camera];
self.view = mapView;

Если вы используете свой собственный идентификатор карты, вы можете в любое время установить для своего идентификатора карты в Cloud Console новый стиль, и этот стиль будет автоматически отражен в вашем представлении карты для вас и пользователей в течение примерно шести часов.

Если вы хотите немедленно увидеть изменения, вы можете закрыть и перезапустить приложение, выйдя из приложения, принудительно завершив работу приложения из списка недавно использованных приложений, а затем снова открыв его. Обновленная карта будет видна.

JavaScript

Чтобы создать карту с идентификатором карты в коде вашего приложения:

  1. Если вы уже настраиваете свою карту с помощью встроенного кода JSON, удалите свойство styles из объекта MapOptions ; в противном случае пропустите этот шаг.

  2. Добавьте идентификатор карты на карту, используя свойство mapId . Например: 

map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8,
mapId: 'MAP_ID'
});

Карты статические

Чтобы добавить идентификатор карты к новой или существующей карте, которая использует один из API-интерфейсов нашего веб-сервиса, добавьте параметр URL-адреса map_id и установите для него идентификатор вашей карты. В этом примере показано добавление идентификатора карты на карту с помощью Maps Static API.

<img src="https://maps.googleapis.com/maps/api/staticmap?center=Brooklyn+Bridge,New+York,NY&zoom=13&size=600x300&maptype=roadmap&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&markers=color:green%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284&key=YOUR_API_KEY&map_id=MAP_ID&signature=YOUR_SIGNATURE" />

Карта в центре Бруклинского моста в Нью-Йорке, штат Нью-Йорк, США, с элементами управления картой в правом нижнем углу. На карте отображаются индивидуальные стили дорог, воды и суши.

Если перед добавлением идентификатора карты у вас есть цифровая подпись в статическом URL-адресе карты, вам потребуется создать и добавить новую цифровую подпись после добавления идентификатора карты. При создании нового секрета подписи URL-адреса не забудьте удалить предыдущую цифровую подпись из URL-адреса.