Z tego dokumentu dowiesz się, jak dostosować wygląd mapy oraz kontrolować widoczność danych i opcje widoku. Możesz to zrobić na 2 sposoby:
- używając definiowania stylów map w Google Cloud;
- ustawiając opcje stylu mapy bezpośrednio w swoim kodzie.
Stylizowanie mapy za pomocą definiowania stylów map w Google Cloud
Aby zastosować styl mapy do mapy udostępniania przejazdu w JavaScript, określ
mapId i
inne
mapOptions
podczas tworzenia JourneySharingMapView.
Z przykładów poniżej dowiesz się, jak zastosować styl mapy za pomocą identyfikatora mapy.
JavaScript
const mapView = new google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
mapOptions: {
mapId: 'YOUR_MAP_ID'
}
// Any other styling options.
});
TypeScript
const mapView = new google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
mapOptions: {
mapId: 'YOUR_MAP_ID'
}
// Any other styling options.
});
Stylizowanie map bezpośrednio w swoim kodzie
Możesz też dostosować styl mapy, ustawiając opcje mapy podczas tworzenia JourneySharingMapView. Z przykładów poniżej dowiesz się, jak stylizować mapę za pomocą opcji mapy. Więcej informacji o opcjach mapy, które możesz ustawić, znajdziesz w dokumentacji interfejsu Maps JavaScript API w sekcji
mapOptions.
JavaScript
const mapView = new google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
mapOptions: {
styles: [
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [
{ "color": "#CCFFFF" }
]
}
]
}
});
TypeScript
const mapView = new google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
mapOptions: {
styles: [
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [
{ "color": "#CCFFFF" }
]
}
]
}
});
Kontrolowanie widoczności danych zadań w pakiecie SDK
Widoczność niektórych obiektów zadań na mapie możesz kontrolować za pomocą reguł widoczności.
Domyślna widoczność danych zadań
Domyślnie dane zadań przypisanych do pojazdu są widoczne, gdy pojazd znajduje się w odległości 5 przystanków od zadania. Widoczność kończy się, gdy zadanie zostanie ukończone lub anulowane.
Ta tabela przedstawia domyślną widoczność każdego typu zadania. Widoczność wielu zadań możesz dostosować, ale nie wszystkich. Więcej informacji o typach zadań znajdziesz w przewodniku Zaplanowane zadania.
| Typ zadania | Domyślna widoczność | Możliwość dostosowania | Opis |
|---|---|---|---|
| Zadania niedostępności | Niewidoczne | Nie | Używane do przerw kierowcy i tankowania. Jeśli trasa do zadania dostawy zawiera też inny przystanek pojazdu, ten przystanek nie jest wyświetlany jeśli zawiera tylko zadania niedostępności. Szacowany czas dotarcia i szacowany czas ukończenia zadania są nadal wyświetlane w przypadku samego zadania dostawy. |
| Otwarte zadania pojazdu | Widoczne | Tak | Widoczność kończy się, gdy zadanie zostanie ukończone lub anulowane. Możesz dostosować widoczność otwartych zadań pojazdu. Zobacz Dostosowywanie widoczności otwartych zadań pojazdu. |
| Zamknięte zadania pojazdu | Niewidoczne | Nie | Nie możesz dostosować widoczności zamkniętych zadań pojazdu. |
Dostosowywanie widoczności otwartych zadań pojazdu
Interfejs TaskTrackingInfo udostępnia kilka elementów danych zadań
, które można wyświetlać za pomocą pakietu SDK dla konsumentów.
| Elementy danych zadań z możliwością dostosowania | |
|---|---|
|
Linie łamane trasy Szacowany czas dotarcia Szacowany czas ukończenia zadania |
Pozostała odległość do zadania Pozostała liczba przystanków Lokalizacja pojazdu |
Opcje widoczności dla każdego zadania
Konfigurację widoczności możesz dostosować dla każdego zadania, ustawiając
TaskTrackingViewConfigpodczas tworzenia lub aktualizowania zadania w
Fleet Engine. Aby utworzyć kryteria określające widoczność elementu zadania, użyj tych opcji widoczności:
| Opcje widoczności | ||
|---|---|---|
|
Pozostała liczba przystanków Czas do szacowanego czasu dotarcia Pozostała odległość dojazdu |
Zawsze widoczne Nigdy niewidoczne |
|
Załóżmy, że przykładowe dostosowanie zmienia widoczność 3 elementów danych za pomocą kryteriów pokazanych w tabeli poniżej. Wszystkie inne elementy są zgodne z domyślnymi regułami widoczności.
| Element danych do dostosowania | Widoczność | Kryterium |
|---|---|---|
| Linia łamana trasy | Pokaż | Pojazd znajduje się w odległości 3 przystanków. |
| Szacowany czas dotarcia na miejsce | Pokaż | Pozostała odległość dojazdu jest krótsza niż 5000 metrów. |
| Pozostała liczba przystanków | Nigdy nie pokazuj | Pojazd znajduje się w odległości 3 przystanków. |
Poniższy przykład pokazuje tę konfigurację:
"taskTrackingViewConfig": {
"routePolylinePointsVisibility": {
"remainingStopCountThreshold": 3
},
"estimatedArrivalTimeVisibility": {
"remainingDrivingDistanceMetersThreshold": 5000
},
"remainingStopCountVisibility": {
"never": true
}
}
Reguły widoczności linii łamanych trasy i lokalizacji pojazdu
Linie łamane trasy nie mogą być widoczne, jeśli nie jest widoczna też lokalizacja pojazdu. W przeciwnym razie lokalizację pojazdu można wywnioskować na podstawie końca linii łamanej.
Te wytyczne pomogą Ci podać prawidłową kombinację opcji widoczności linii łamanej trasy i lokalizacji pojazdu.
| Te same opcje widoczności | Kryterium widoczności | Wskazówki |
|---|---|---|
| Opcje linii łamanych trasy ustawione na zawsze widoczne. | Ustaw lokalizację pojazdu na zawsze widoczną. | |
| Lokalizacja pojazdu ustawiona na nigdy niewidoczną. | Ustaw linie łamane trasy na nigdy niewidoczne. | |
Opcja widoczności to jedna z tych opcji:
|
Ustaw opcje linii łamanej trasy na wartość mniejszą lub równą wartości ustawionej dla lokalizacji pojazdu. Na przykład: "taskTrackingViewConfig": {
"routePolylinePointsVisibility": {
"remainingStopCountThreshold": 3
},
"vehicleLocationVisibility": {
"remainingStopCountThreshold": 5
},
}
|
|
| Różne opcje widoczności | Kryteria widoczności | Wskazówki |
| Lokalizacja pojazdu jest widoczna. | Dzieje się tak tylko wtedy, gdy spełnione są zarówno opcje widoczności lokalizacji pojazdu, jak i linii łamanej. Na przykład: "taskTrackingViewConfig": {
"routePolylinePointsVisibility": {
"remainingStopCountThreshold": 3
},
"vehicleLocationVisibility": {
"remainingDrivingDistanceMetersThreshold": 3000
},
}W tym przykładzie lokalizacja pojazdu jest widoczna tylko wtedy, gdy pozostała liczba przystanków wynosi co najmniej 3 ORAZ pozostała odległość dojazdu wynosi co najmniej 3000 metrów. |
Wyłączanie automatycznego dopasowywania
Możesz wyłączyć automatyczne dopasowywanie, aby mapa nie dopasowywała automatycznie widoku do pojazdu i przewidywanej trasy. Z przykładu poniżej dowiesz się, jak wyłączyć automatyczne dopasowywanie podczas konfigurowania widoku mapy udostępniania przejazdu.
JavaScript
const mapView = new
google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
automaticViewportMode:
google.maps.journeySharing
.AutomaticViewportMode.NONE,
...
});
TypeScript
const mapView = new
google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
automaticViewportMode:
google.maps.journeySharing
.AutomaticViewportMode.NONE,
...
});