Karte gestalten

Plattform auswählen: Android iOS JavaScript

In diesem Leitfaden wird beschrieben, wie Sie die Karte, die in Ihrem Android-App, wenn Sie einer Fahrt folgen. Sie können das Design Ihrer auf folgende Weise bearbeiten:

Funktionen zum cloudbasierten Gestalten von Karteninhalten verwenden

Erscheinungsbild der Google Maps-Komponente mithilfe cloudbasierter Karten anpassen Stile. In der Google Cloud Console können Sie Kartenstile für alle Ihrer Apps, die Google Maps verwenden, ohne dass Sie Änderungen an Ihrem Code vornehmen müssen. Weitere Informationen finden Sie unter Cloudbasiertes Gestalten von Karteninhalten

Sowohl die ConsumerMapView und die ConsumerMapFragment -Klassen unterstützen das cloudbasierte Gestalten von Karteninhalten. Wenn Sie das cloudbasierte Gestalten von Karteninhalten verwenden möchten, müssen die ausgewählten Karten Renderer ist LATEST. In den folgenden Abschnitten finden Sie Beispiele cloudbasiertes Gestalten von Karteninhalten.

ConsumerMapView

Wenn Sie das cloudbasierte Gestalten von Karteninhalten in ConsumerMapView verwenden möchten, legen Sie den Parameter mapId-Feld auf GoogleMapOptions und übergeben Sie GoogleMapOptions an getConsumerGoogleMapAsync(ConsumerMapReadyCallback, Fragment, GoogleMapOptions) or getConsumerGoogleMapAsync(ConsumerMapReadyCallback, FragmentActivity, GoogleMapOptions)

Beispiel

Java

public class SampleAppActivity extends AppCompatActivity {

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    ConsumerMapView mapView = findViewById(R.id.consumer_map_view);

    if (mapView != null) {
      GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
      mapView.getConsumerGoogleMapAsync(
          new ConsumerMapReadyCallback() {
            @Override
            public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
              // ...
            }
          },
          /* fragmentActivity= */ this,
          /* googleMapOptions= */ optionsWithMapId);
    }
  }
}

Kotlin

class SampleAppActivity : AppCompatActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    val mapView = findViewById(R.id.consumer_map_view) as ConsumerMapView

    val optionsWithMapId = GoogleMapOptions().mapId("map-id")
    mapView.getConsumerGoogleMapAsync(
      object : ConsumerGoogleMap.ConsumerMapReadyCallback() {
        override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
          // ...
        }
      },
      /* fragmentActivity= */ this,
      /* googleMapOptions= */ optionsWithMapId)
  }
}

ConsumerMapFragment

Es gibt zwei Möglichkeiten, das cloudbasierte Gestalten von Karteninhalten zu nutzen: ConsumerMapFragments:

  • Statisch mit der XML-Datei.
  • Dynamisch mit newInstance.

Statisch mit XML

Wenn Sie das cloudbasierte Gestalten von Karteninhalten mit dem XML-Code in der ConsumerMapFragment, fügen Sie das XML-Attribut map:mapId mit dem angegebenen Wert mapId Sehen Sie sich folgendes Beispiel an:

<fragment
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    android:name="com.google.android.libraries.mapsplatform.transportation.consumer.view.ConsumerMapFragment"
    android:id="@+id/consumer_map_fragment"
    map:mapId="map-id"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

Dynamisch mit newInstance

So verwenden Sie das cloudbasierte Gestalten von Karteninhalten mit newInstance in ConsumerMapFragment, legen Sie das Feld mapId auf GoogleMapOptions fest und übergeben Sie den GoogleMapOptions bis newInstance. Sehen Sie sich folgendes Beispiel an:

Java

public class SampleFragmentJ extends Fragment {

  @Override
  public View onCreateView(
      @NonNull LayoutInflater inflater,
      @Nullable ViewGroup container,
      @Nullable Bundle savedInstanceState) {

    final View view = inflater.inflate(R.layout.consumer_map_fragment, container, false);

    GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
    ConsumerMapFragment consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId);

    getParentFragmentManager()
        .beginTransaction()
        .add(R.id.consumer_map_fragment, consumerMapFragment)
        .commit();

    consumerMapFragment.getConsumerGoogleMapAsync(
        new ConsumerMapReadyCallback() {
          @Override
          public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
            // ...
          }
        });

    return view;
  }
}

Kotlin

class SampleFragment : Fragment() {
  override fun onCreateView(
    inflater: LayoutInflater,
    container: ViewGroup?,
    savedInstanceState: Bundle?): View? {

    val view = inflater.inflate(R.layout.consumer_map_fragment, container, false)

    val optionsWithMapId = GoogleMapOptions().mapId("map-id")
    val consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId)

    parentFragmentManager
      .beginTransaction()
      .add(R.id.consumer_map_fragment, consumerMapFragment)
      .commit()

    consumerMapFragment.getConsumerGoogleMapAsync(
      object : ConsumerMapReadyCallback() {
        override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
          // ...
        }
      })

    return view
  }
}

Du kannst den Kamerazoom anpassen, um dich auf eine Fahrt zu fokussieren

Während einer aktiven Sitzung mit dem Teilen der Reise können Sie den Kamerazoom und sich auf eine von zwei Arten konzentrieren:

  • AutoCamera: Wenn Sie AutoCamera verwenden möchten, haben Sie die irgendetwas tun können. Die Kamera folgt der Fahrt. Weitere Informationen finden Sie unter AutoCamera

  • Kameraverhalten anpassen: Sie müssen AutoCamera deaktivieren und dann Ihre Anpassungen vornehmen. Weitere Informationen Weitere Informationen finden Sie unter Kameraverhalten anpassen.

AutoCamera zentriert die Kamera

Das Consumer SDK bietet eine AutoCamera-Funktion, die standardmäßig aktiviert ist. über die integrierte Schaltfläche Mein Standort für das Maps SDK. Die Kamera zoomt sich auf die Route und den nächsten Wegpunkt konzentrieren.

Wenn Sie AutoCamera verwenden möchten, müssen Sie es aktivieren. Weitere Informationen finden Sie unter isAutoCameraEnabled

`AutoCamera`

Weitere Informationen zur Schaltfläche Mein Standort finden Sie unter Schaltfläche „Mein Standort“ in der Dokumentation zur Maps JavaScript API.

Kameraverhalten anpassen

Wenn Sie das Verhalten der Kamera besser steuern möchten, gehen Sie so vor, um die Funktion AutoCamera und das Kameraverhalten manuell anpassen.

  1. Deaktivieren Sie AutoCamera mit ConsumerController.setAutoCameraEnabled().

  2. Rufen Sie die empfohlenen Kameragrenzen mit ConsumerController.getCameraUpdate() ab.

  3. Gib CameraUpdate als Argument für eine der folgenden Android-Funktionen an:

Nächste Schritte

Reisen auf Android folgen