Używanie identyfikatorów map

Identyfikator mapy to niepowtarzalny identyfikator, który reprezentuje pojedynczą instancję Mapy Google. Identyfikatorów map używasz do włączania funkcji oraz do zarządzania mapami i ich stylami w swoich witrynach i aplikacjach. Identyfikatory map możesz tworzyć dla każdej platformy, której potrzebujesz (JavaScript, Android, iOS lub mapy statyczne) w projekcie w Google Cloud Console na stronie Zarządzanie mapami.

Co możesz zrobić z identyfikatorami map

Używaj identyfikatorów map, aby włączać funkcje i stylizację. Oto kilka przykładów używania identyfikatorów mapy. Pełną listę znajdziesz w artykule Funkcje korzystające z identyfikatorów map:

  • Definiowanie stylów map w Google Cloud: powiązanie identyfikatora mapy ze stylem mapy umożliwia stylizowanie map, ich dostosowywanie i zarządzanie nimi za pomocą konsoli Google Cloud. Dostępne na wszystkich platformach: JavaScript, Android, iOSinterfejs Maps Static API.

  • Mapy wektorowe: użyj identyfikatora mapy, aby użyć mapy złożonej z płytek wektorowych, które są rysowane podczas wczytywania po stronie klienta za pomocą WebGL. Dostępne w JavaScript.

  • Zaawansowane znaczniki: użyj identyfikatora mapy, aby włączyć zaawansowane znaczniki. Dostępne w JavaScript, na Android i iOS.

Przykład definiowania stylów map w Google Cloud

Aby korzystać z definiowania stylów map w Google Cloud w przypadku map na stronie internetowej i w aplikacjach na Androida, wykonaj te czynności:

  1. Utwórz identyfikatory map dla każdej platformy, której używasz. Utwórz na przykład identyfikator mapy JavaScript i Androida. Więcej informacji znajdziesz w artykule Tworzenie identyfikatorów map.

  2. Skonfiguruj styl mapy w konsoli Google Cloud. Szczegółowe informacje znajdziesz w artykule o definiowaniu stylów map w Google Cloud.

  3. Połącz oba identyfikatory mapy ze stylem mapy w konsoli Google Cloud. Szczegółowe informacje znajdziesz w artykule Powiązanie identyfikatorów map z stylem.

  4. Odwołuj się do identyfikatora mapy w kodzie JavaScript witryny i aplikacji na Androida. Szczegółowe informacje znajdziesz w artykule Dodawanie identyfikatora mapy do aplikacji.

Styl map powiązany z identyfikatorami map jest następnie wyświetlany na stronie internetowej i w aplikacji na Androida. Możesz aktualizować styl mapy w Cloud Console, a zmiany będą automatycznie pojawiać się w obu miejscach bez konieczności aktualizowania aplikacji przez klientów.

Funkcje korzystające z identyfikatorów map

W tabeli poniżej podano funkcje i interfejsy API Google Maps Platform, które używają identyfikatorów mapy:

Funkcja lub interfejs API Korzystają z identyfikatorów map do realizacji tych celów
znaczniki zaawansowane, Włącz zaawansowane znaczniki. Nie musisz tworzyć identyfikatora mapy. Zamiast tego możesz użyć identyfikatora demonstracyjnej mapy „DEMO_MAP_ID”.
Stylizacja granic na podstawie danych Połącz identyfikator mapy z zestawem granic i stylu, aby sformatować mapę zgodnie z tymi granicami.
Styl oparty na danych dla zbiorów danych Połącz identyfikator mapy z zestawem danych i stylem, aby sformatować mapę zgodnie ze zbiorem danych.
Flutter nadawać styl mapom Google używanym w aplikacjach Flutter;
Maps Embed API Określ i skonfiguruj mapę, która ma być umieszczona na stronie internetowej.
Maps JavaScript API nadać mapie styl, aby wyświetlała się na stronie internetowej;
Maps SDK na Androida nadać styl mapie, która ma być wyświetlana w aplikacji na Androida1;
Maps SDK na iOS nadać styl mapie, która ma być wyświetlana w aplikacji na iOS1;
Maps Static API Określ mapę i nadaj jej styl, aby została wyrenderowana jako obraz statyczny.
Rozwiązania dotyczące mobilności Użyj interfejsu Maps JavaScript API oraz pakietów SDK na Androida i iOS, aby nadać styl mapom w rozwiązaniach mobilnych.1
WebGL (mapy wektorów) Włącz funkcje WebGL za pomocą identyfikatora mapy wektorowej w JavaScript.

1 Użycie identyfikatora mapy w pakiecie Maps SDK na Androida lub Maps SDK na iOS powoduje wczytanie mapy, które skutkuje naliczeniem opłaty za mapę dynamiczną.

Jak tworzyć identyfikatory map i z nich korzystać

Identyfikator mapy to niepowtarzalny identyfikator, który reprezentuje pojedynczą instancję Mapy Google. Identyfikatory map tworzysz i aktualizujesz w konsoli Cloud, a style map powiązane z identyfikatorem mapy w konsoli Cloud.

Wymagane uprawnienia

Aby tworzyć identyfikatory map w projekcie lub nimi zarządzać, musisz użyć podmiotu zabezpieczeń z odpowiednimi uprawnieniami na poziomie roli (Edytuj lub Właściciel) na stronie Uprawnienia w Cloud Console. Więcej informacji znajdziesz w artykule Informacje o rolach podstawowych i wstępnie zdefiniowanych w IAM.

Tworzenie identyfikatorów map

Identyfikatory map możesz tworzyć i aktualizować w dowolnym momencie w konsoli Cloud.

Aby utworzyć identyfikator mapy:

  1. Zaloguj się i otwórz projekt Cloud Console z wymaganymi uprawnieniami.

  2. W konsoli Cloud otwórz stronę Zarządzanie Mapami.

  3. Wybierz Utwórz identyfikator mapy.

    Utwórz nowy identyfikator mapy

  4. Na stronie Utwórz nowy identyfikator mapy wykonaj te czynności:

    1. W polu Name (Nazwa) wpisz nazwę identyfikatora mapy.
    2. Opcjonalnie: w polu Opis opisz, do czego służy identyfikator mapy.
    3. W sekcji Typ mapy wybierz platformę, na której chcesz używać identyfikatora mapy. Jeśli wybierzesz JavaScript, wybierz też typ mapy: Raster (domyślny) lub Wektor. Więcej informacji o mapach wektorowych znajdziesz w artykule Mapy wektorowe.
    4. Aby wyświetlić nowy identyfikator mapy, kliknij Zapisz.

Powiązanie identyfikatora mapy ze stylem mapy

W tych instrukcjach przyjęto, że w Twoim projekcie jest co najmniej 1 styl mapy. Jeśli nie masz żadnych stylów map, zapoznaj się z artykułem Definiowanie stylów map w Google Cloud i wybierz swoją platformę, aby uzyskać instrukcje tworzenia stylów.

  1. W konsoli Cloud otwórz stronę Zarządzanie Mapami.
  2. W tabeli wybierz istniejący identyfikator mapy.
  3. W sekcji Powiązany styl mapy wybierz styl mapy.
  4. Kliknij Zapisz.

    Strona ze szczegółami identyfikatora mapy, na której możesz powiązać styl mapy

Dodawanie identyfikatora mapy do aplikacji

Android

Dodaj identyfikator mapy za pomocą elementu <fragment> w pliku układu aktywności, używając klasy MapView, lub programowo za pomocą klasy GoogleMapOptions.

Załóżmy na przykład, że utworzyłeś identyfikator mapy, który jest przechowywany jako wartość ciągu znaków o nazwie map_id w elementach res/values/strings.xml:

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

W przypadku map dodanych za pomocą elementu <fragment> w pliku układu aktywności wszystkie fragmenty mapy, które mają mieć styl niestandardowy, muszą mieć określony identyfikator mapy w atrybucie 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" />

Aby określić identyfikator mapy, możesz też użyć atrybutu map:mapId klasy MapView:

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

Aby określić identyfikator mapy w sposób programowy, prześlij go do instancji MapFragment za pomocą klasy 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))
 )

W Android Studio utwórz i uruchom aplikację jak zwykle. Niestandardowe style skonfigurowane w pierwszym kroku są stosowane do wszystkich map z wybranym identyfikatorem mapy.

iOS

Aby utworzyć instancję mapy za pomocą identyfikatora mapy, wykonaj te czynności:

  1. Utwórz GMSMapID za pomocą ciągu znaków identyfikatora mapy z konsoli Cloud.
  2. Utwórz GMSMapView, podając utworzony właśnie identyfikator mapy.

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;

Jeśli używasz własnego identyfikatora mapy, możesz go ustawić w konsoli Cloud, aby w dowolnym momencie stosować nowy styl. Styl zostanie automatycznie uwzględniony w widoku mapy w Twoim przypadku i w przypadku użytkowników w ciągu około 6 godzin.

Jeśli chcesz, aby zmiany zostały zastosowane natychmiast, możesz zamknąć aplikację i ponownie ją uruchomić. Aby to zrobić, zamknij aplikację, wymuszając jej zamknięcie z listy ostatnio używanych aplikacji, a następnie otwórz ją ponownie. Zaktualizowana mapa będzie wtedy widoczna.

JavaScript

Aby utworzyć mapę z identyfikatorem mapy w kodzie aplikacji:

  1. Jeśli mapę dostosowujesz już za pomocą wbudowanego kodu JSON, usuń właściwość styles z obiektu MapOptions. W przeciwnym razie pomiń ten krok.

  2. Dodaj identyfikator mapy do mapy za pomocą właściwości mapId. Na przykład:

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

Mapy statyczne

Aby dodać identyfikator mapy do nowej lub istniejącej mapy, która korzysta z jednego z naszych interfejsów API usług internetowych, dodaj parametr map_id URL i ustaw go jako identyfikator mapy. Ten przykład pokazuje dodawanie identyfikatora mapy do mapy za pomocą Map 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" />

Mapa z mostem Brooklyńskim w Nowym Jorku (Nowy Jork, USA) w środku. W prawym dolnym rogu znajdują się elementy sterujące mapą. Mapy wyświetlają niestandardowy styl dróg, wody i ziemi.

Jeśli przed dodaniem identyfikatora mapy masz podpis cyfrowy w adresie URL statycznego Map, po dodaniu identyfikatora mapy musisz utworzyć i dodać nowy podpis cyfrowy. Podczas generowania nowego sekretu podpisywania adresu URL pamiętaj, aby usunąć z adresu URL poprzednią cyfrową sygnaturę.