In diesem Leitfaden wird beschrieben, wie Sie die Karte gestalten können, wird in Ihrer iOS-App angezeigt, wenn Sie einer Fahrt folgen.
Hinweis
Um den Stil einer Karte zu bearbeiten, benötigen Sie eine Nutzer-App mit wurde Folgendes implementiert:
Eine Kartenansicht. Weitere Informationen finden Sie unter Kartenansicht initialisieren.
Eine Methode zum Verarbeiten von Kartenansichtsereignissen. Weitere Informationen finden Sie unter Kartenansichtsereignisse verarbeiten
Sie müssen auch die Back-End-Dienste eingerichtet haben, die das Consumer SDK benötigt, und das Consumer SDK einrichten. Weitere Informationen und What is Fleet Engine?.
Kartenanpassungen
Folgende Anpassungen sind verfügbar:
Karte gestalten: Sie können Kartenfarben, Polylinien und andere Kartenelemente gestalten. mit cloudbasiertem Gestalten von Karteninhalten. Weitere Informationen finden Sie unter Karte gestalten.
Zoom der Kamera anpassen: Sie können die integrierte Funktion verwenden oder einen eigenen Wert festlegen. Kameraoptionen, um dich auf eine Reise zu fokussieren. Weitere Informationen finden Sie unter Passen Sie den Kamerazoom an, um die Fahrt zu fokussieren.
Markierungen und Polylinien anpassen: Sie können benutzerdefinierte Markierungen und Routen hinzufügen. Polylinien auf Ihr App-Design. Diese Designelemente ermöglichen es App, um eine dynamische Vorschau der Route des Fahrzeugs anzuzeigen. Weitere Informationen finden Sie unter Markierungen anpassen und Polylinien anpassen
Das SDK bietet diese Optionen über die
consumerMapStyleCoordinator
Property. Dieses Attribut ist über die KlasseGMTCMapView
verfügbar.
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 User Journey ist es hilfreich, dass die Nutzenden sehen,
eine größere Ansicht des Fahrzeugs während der Fahrt als eine Nahaufnahme
des Fahrzeugs auf einer Route. Dazu passen Sie den Kamerazoom an,
Wasserwaage über das integrierte AutoCamera
oder durch Anpassen des Kameraverhaltens
wie folgt:
AutoCamera
: Wenn SieAutoCamera
verwenden möchten, haben Sie die irgendetwas tun können. Die Kamera folgt standardmäßig der Fahrt.Kameraverhalten anpassen: So passen Sie das Kameraverhalten an: Sie müssen
AutoCamera
deaktivieren und dann Ihre Anpassungen vornehmen.
AutoCamera
zentriert die Kamera standardmäßig
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, muss es aktiviert sein. Weitere Informationen finden Sie unter
allowCameraAutoUpdate
Weitere Informationen zur Schaltfläche Mein Standort für das Maps SDK finden Sie unter Schaltfläche „Mein Standort“ in der Maps SDK-Dokumentation für iOS.
Kameraverhalten anpassen
Wenn Sie das Kameraverhalten genauer steuern möchten, können Sie AutoCamera
deaktivieren und
wie Sie das Kameraverhalten anpassen können.
Deaktivieren oder aktivieren Sie AutoCamera
mit der
AllowCameraAutoUpdate
Property.
Weitere Einstellungen für die Kamera findest du unter Kamera bewegen in der Maps SDK-Dokumentation für iOS.