Идентификатор карты – это уникальный код, который представляет настройки стиля и конфигурации Google Карт, хранящиеся в Google Cloud. Идентификаторы карт позволяют включать функции, управлять картами и задавать их стиль на сайтах и в приложениях. Вы можете создать идентификаторы карт для каждой нужной платформы (JavaScript, Android, iOS или статических карт) в проекте консоли Google Cloud на странице Управление картами.
Подробнее об идентификаторах карт и функциях, в которых они используются…
Требуемые права доступа
Чтобы создавать идентификаторы карт в проекте и управлять ими, у вас должны быть права редактора или владельца на странице IAM в Cloud Console. Подробную информацию вы найдете в справочнике по базовым и стандартным ролям IAM.
Создание идентификаторов карт
Чтобы создать идентификаторы карт в Cloud Console, выполните следующие действия:
Войдите в аккаунт и откройте проект в консоли Cloud с необходимыми разрешениями.
В Cloud Console перейдите на страницу управления картами.
Нажмите Создать идентификатор карты.
На странице Создать новый идентификатор карты выполните следующие действия:
- В поле Name (Название) укажите название идентификатора карты.
- Необязательно. В поле Описание укажите, для чего используется идентификатор карты.
- В разделе Map type (Тип карты) выберите платформу, на которой планируете использовать идентификатор карты. Если вы выберете JavaScript, вам также нужно будет выбрать тип карты: Растровая (по умолчанию) или Векторная. Подробнее о векторных картах…
- Нажмите Сохранить, чтобы увидеть новый идентификатор карты.
Как связать идентификатор карты со стилем карты
Если вы используете облачные стили карт, то связываете стиль карты с ее идентификатором. Подробнее о том, как связать стиль с идентификатором карты…
Добавьте идентификатор карты в приложение
Android
Вы можете добавить идентификатор карты в элемент <fragment> файла макета для объекта activity. Это можно сделать с помощью класса 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> в файле макета для объекта activity, то во всех фрагментах карты с собственным стилем должен быть указан идентификатор карты в атрибуте 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:map="http://schemas.android.com/apk/res-auto"
....
map:mapId="@string/map_id" />
Чтобы указать идентификатор карты программным способом, передайте его в экземпляр MapFragment с помощью класса GoogleMapOptions:
Java
MapFragment mapFragment = MapFragment.newInstance(
new GoogleMapOptions()
.mapId(getResources().getString(R.string.map_id)));
Kotlin
val mapFragment = MapFragment.newInstance(
GoogleMapOptions()
.mapId(resources.getString(R.string.map_id))
)
Создайте и запустите приложение в Android Studio, как обычно. Собственные стили, настроенные на первом шаге, будут применены ко всем картам с указанным идентификатором.
Android 3D
Задайте строковое свойство mapId для элемента Map3DOptions программно или с помощью атрибутов макета. Map3DOptions передаются объекту Map3DView во время создания экземпляра и не могут быть изменены после создания Map3DView.
Добавьте идентификатор карты, создав карту программным способом:
import com.google.android.gms.maps3d.GoogleMap3D
import com.google.android.gms.maps3d.Map3DOptions
import com.google.android.gms.maps3d.Map3DView
import com.google.android.gms.maps3d.OnMap3DViewReadyCallback
import com.google.android.gms.maps3d.model.Map3DMode
class MainActivity : Activity(), OnMap3DViewReadyCallback {
fun onCreate(...) {
val map3DOptions = Map3DOptions(mapMode = Map3DMode.HYBRID, mapId = "MAP_ID")
val map3DView = Map3DView(context, map3DOptions)
map3DView.getMap3dViewAsync(this)
}
}
Добавьте идентификатор карты с помощью атрибутов макета:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map3d="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent" android:layout_height="match_parent">
<com.google.android.gms.maps3d.Map3DView
android:id="@+id/map3dView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
map3d:mode="hybrid"
map3d:mapId="MAP_ID"/>
</LinearLayout>
iOS
Чтобы создать экземпляр карты с помощью идентификатора карты, выполните следующие действия:
- Создайте объект
GMSMapIDсо строкой идентификатора карты из Cloud Console. - Создайте
GMSMapView, указав идентификатор карты, который вы только что создали.
Swift
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
Objective-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. Он будет автоматически применен к карте в течение шести часов.
Чтобы изменения вступили в силу немедленно, закройте приложение, принудительно завершите его работу в списке недавно использованных приложений и снова откройте его. После этого вы увидите обновленную карту.
iOS 3D
Разработчики iOS могут задать новый модификатор style для Map. Этот модификатор принимает идентификатор карты и, при необходимости, замыкание, которое вызывается, если идентификатор карты недействителен или не найден.
import SwiftUI
import GoogleMaps3D
struct ContentView: View {
init () {
Map.apiKey = "YOUR_API_KEY"
}
var body: some View {
Map(initialCamera: .init(
latitude: 0.0,
longitude: 0.0,
),
mode: .hybrid
)
.style(
with: "MAP_ID",
error: {
// Handle styling error.
}
)
// Could also use trailing closure syntax
// .style(with: "MAP_ID") {
// // Handle styling error.
// }
}
}
JavaScript
Чтобы создать карту с идентификатором в коде приложения, выполните следующие действия:
Если вы уже настраиваете карту с помощью встроенного кода JSON, удалите свойство
stylesиз объектаMapOptions. В противном случае пропустите этот шаг.Добавьте идентификатор карты с помощью свойства
mapId. Пример:
map = new google.maps.Map(document.getElementById('map'), { center: {lat: -34.397, lng: 150.644}, zoom: 8, mapId: 'MAP_ID' });
Javascript 3D
Чтобы создать карту с идентификатором в приложении, добавьте идентификатор карты в карту, используя свойство mapId. Пример:
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', }); document.body.append(map); } void init();
Maps Static
Чтобы добавить идентификатор карты на новую или существующую карту, использующую один из наших 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" />