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, iOS i interfejs 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 na potrzeby stylizacji 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. Możesz na przykład utworzyć 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 w przypadku 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ć mapie styl, aby wyświetlała się 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 z informacjami o identyfikatorze 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 zobaczyć zmiany od razu, możesz zamknąć i ponownie uruchomić aplikację, wychodząc z niej, wymuszając jej zamknięcie z listy ostatnio używanych aplikacji, a następnie otwierając 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ę.