Karten-IDs erstellen

Android

Sie können Ihre Karten-ID mit einem <fragment> Element in der Layoutdatei der Aktivität über die Klasse MapView oder programmatisch über die Klasse GoogleMapOptions hinzufügen.

Angenommen, Sie haben eine Karten-ID erstellt, die als Stringwertmap_id in res/values/strings.xml gespeichert ist:

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

Bei Karten, die über ein <fragment> Element in der Layoutdatei der Aktivität hinzugefügt werden, muss für alle Kartenfragmente, die den benutzerdefinierten Stil haben sollen, die Karten-ID im map:mapId Attribut angegeben werden:

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

Sie können auch das Attribut map:mapId der Klasse MapView verwenden, um eine Karten-ID anzugeben:

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

Wenn Sie eine Karten-ID programmatisch angeben möchten, übergeben Sie sie mithilfe der Klasse GoogleMapOptions an eine MapFragment-Instanz:

 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))
 )

Erstellen Sie wie gewohnt Ihre App in Android Studio und führen Sie sie aus. Benutzerdefinierte Stile, die im ersten Schritt konfiguriert wurden, werden auf alle Karten mit der angegebenen Karten-ID angewendet.

Android 3D

Legen Sie die String-Eigenschaft mapId für Map3DOptions entweder programmatisch oder mithilfe von Layoutattributen fest. Map3DOptions werden während der Instanziierung an das Map3DView-Objekt übergeben und können nach der Erstellung von Map3DView nicht mehr geändert werden.

Entwickler können optional einen neuen OnMapIdErrorListener implementieren, um benachrichtigt zu werden und auf eine ungültige oder nicht gefundene Karten-ID zu reagieren.

So fügen Sie eine Karten-ID hinzu, erstellen die Karte programmatisch und legen einen OnMapIdErrorListener fest:

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, OnMapIdError {
  fun onCreate(...) {
    val map3DOptions = Map3DOptions(mapMode = Map3DMode.HYBRID, mapId = "MAP_ID")
    val map3DView = Map3DView(context, map3DOptions)
    map3DView.getMap3dViewAsync(this)
  }

  override fun onMap3DViewReady(googleMap3D: GoogleMap3D) {
    googleMap3D.setMapIdErrorListener(
      object : OnMapIdErrorListener {
        override fun onMapIdError() {
          // Handle error event.
        }
      }
    )
  }
}

So fügen Sie eine Karten-ID mithilfe von Layoutattributen hinzu:

<?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

So instanziieren Sie eine Karte mit einer Karten-ID:

1. Erstellen Sie eine GMSMapID mit dem Karten-ID-String aus der Cloud Console.
2. Erstellen Sie eine GMSMapView und geben Sie die gerade erstellte Karten-ID an.

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

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;

Wenn Sie Ihre eigene Karten-ID verwenden, können Sie in der Cloud Console jederzeit einen neuen Stil dafür festlegen. Dieser Stil wird dann innerhalb von etwa sechs Stunden automatisch in Ihrer Kartenansicht für Sie und Ihre Nutzer angezeigt.

Wenn Sie die Änderungen sofort sehen möchten, können Sie die App schließen und neu starten. Beenden Sie dazu die App, erzwingen Sie das Beenden der App über die Liste der zuletzt verwendeten Apps und öffnen Sie sie dann wieder. Die aktualisierte Karte ist dann sichtbar.

iOS 3D

iOS-Entwickler können für Map einen neuen style-Modifikator festlegen. Dieser Modifikator akzeptiert eine Karten-ID und optional einen Abschluss, der aufgerufen wird, wenn die Karten-ID ungültig ist oder nicht gefunden wird.

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

So erstellen Sie eine Karte mit einer Karten-ID in Ihrem Anwendungscode:

1. Wenn Sie Ihre Karte bereits mit eingebettetem JSON-Code anpassen, entfernen Sie die styles Eigenschaft aus Ihrem MapOptions Objekt. Andernfalls überspringen Sie diesen Schritt.

2. Fügen Sie der Karte mit der Eigenschaft mapId eine Karten-ID hinzu. Beispiel:

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

JavaScript 3D

Wenn Sie in Ihrer Anwendung eine Karte mit einer Karten-ID erstellen möchten, fügen Sie der Karte mit der Eigenschaft mapId eine Karten-ID hinzu. Beispiel:

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();
index.js

Maps Static

Wenn Sie einer neuen oder vorhandenen Karte, die eine unserer Webdienst-APIs verwendet, eine Karten-ID hinzufügen möchten, hängen Sie den URL-Parameter map_id an und legen Sie ihn auf Ihre Karten-ID fest. In diesem Beispiel wird gezeigt, wie Sie einer Karte mit der Maps Static API eine Karten-ID hinzufügen.

<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" />