התאמה אישית של המראה והתחושה של סמנים שנוספו למפה. יש שתי דרכים להתאים אישית את המראה של הסמנים שמוסיפים למפה:
סמני סגנון שמבוססים על סוג: מציינים אובייקט
MarkerOptionsכדי להגדיר סגנון לסמנים מאותו סוג. השינויים שאתם מציינים מוחלים אחרי שכל סמן נוצר, ומחליפים את אפשרויות ברירת המחדל. דוגמאות מופיעות במאמר שינוי הסגנון של סמנים באמצעותMarkerOptionsבמדריך הזה.סמני סגנון שמבוססים על נתונים: אפשר לציין פונקציית התאמה אישית כדי להגדיר סמני סגנון שמבוססים על נתונים. אתם יכולים להגדיר סגנון על סמך נתונים משיתוף נתונים על מסלול ההמרה או ממקורות חיצוניים:
נתונים משיתוף נסיעות: שיתוף נסיעות מעביר נתוני סמנים לפונקציית ההתאמה האישית, כולל סוג האובייקט שהסמן מייצג: רכב, נקודת מוצא, נקודת ביניים או יעד. העיצוב של הסמן משתנה בהתאם למצב הנוכחי של רכיב הסמן. לדוגמה, מספר נקודות הציון שנותרו עד שהרכב יסיים את הנסיעה.
מקורות חיצוניים: אפשר לשלב את נתוני שיתוף הנסיעה עם נתונים ממקורות חיצוניים ל-Fleet Engine, ולעצב את הסמן על סמך המידע הזה.
דוגמאות מופיעות במאמר שינוי הסגנון של סמנים באמצעות פונקציות להתאמה אישית במדריך הזה.
הוספת טיפול בקליקים לסמנים: דוגמאות מופיעות במאמר הוספת טיפול בקליקים.
אפשרויות להתאמה אישית של ההדגשה
שתי האפשרויות משתמשות בפרמטרים הבאים להתאמה אישית בממשק API של JavaScript במפות Google בקטע FleetEngineTripLocationProviderOptions:
vehicleMarkerCustomizationoriginMarkerCustomizationwaypointMarkerCustomizationdestinationMarkerCustomization
שינוי הסגנון של סמנים באמצעות MarkerOptions
בדוגמה הבאה מוצג אופן ההגדרה של סגנון סמן הרכב באמצעות אובייקט MarkerOptions. אפשר להשתמש בתבנית הזו כדי להתאים אישית את הסגנון של כל סמן באמצעות כל אחת מאפשרויות ההתאמה האישית של הסמנים שמפורטות במאמר אפשרויות להתאמה אישית של סמנים.
JavaScript
deliveryVehicleMarkerCustomization = {
cursor: 'grab'
};
TypeScript
deliveryVehicleMarkerCustomization = {
cursor: 'grab'
};
שינוי הסגנון של סמנים באמצעות פונקציות להתאמה אישית
בדוגמה הבאה מוצגות פונקציות להתאמה אישית שבעזרתן אפשר להגדיר את הסגנון של סמן הרכב. כדי להתאים אישית את הסגנון של סמן כלשהו, פועלים לפי הדפוס הזה ומשתמשים בכל אחד מפרמטרים ההתאמה האישית של הסמנים שמפורטים במאמר אפשרויות להתאמה אישית של סמנים.
JavaScript
vehicleMarkerCustomization =
(params) => {
var distance = params.trip.remainingWaypoints.length;
params.marker.setLabel(`${distance}`);
};
TypeScript
vehicleMarkerCustomization =
(params: TripMarkerCustomizationFunctionParams) => {
const distance = params.trip.remainingWaypoints.length;
params.marker.setLabel(`${distance}`);
};
הוספת טיפול בקליקים לסמנים
בדוגמה הבאה אפשר לראות איך מוסיפים טיפול בקליקים לסמן של רכב. אפשר להשתמש בדפוס הזה כדי להוסיף טיפול בקליקים לכל סמן באמצעות כל אחד מפרמטרים ההתאמה האישית של הסמן שמפורטים באפשרויות להתאמה אישית של סמנים.
JavaScript
vehicleMarkerCustomization =
(params) => {
if (params.isNew) {
params.marker.addListener('click', () => {
// Perform desired action.
});
}
};
TypeScript
vehicleMarkerCustomization =
(params: TripMarkerCustomizationFunctionParams) => {
if (params.isNew) {
params.marker.addListener('click', () => {
// Perform desired action.
});
}
};