התאמה אישית של הסמנים

בחירת פלטפורמה: Android iOS JavaScript

התאמה אישית של המראה והתחושה של סמנים שנוספו למפה. יש שתי דרכים להתאים אישית את המראה של הסמנים שמוסיפים למפה:

1. סמני סגנון שמבוססים על סוג: מציינים אובייקט MarkerOptions כדי להגדיר סגנון לסמנים מאותו סוג. השינויים שאתם מציינים מוחלים אחרי שכל סמן נוצר, ומחליפים את אפשרויות ברירת המחדל. דוגמאות מופיעות במאמר שינוי הסגנון של סמנים באמצעות MarkerOptions במדריך הזה.

2. סמני סגנון שמבוססים על נתונים: אפשר לציין פונקציית התאמה אישית כדי להגדיר סמני סגנון שמבוססים על נתונים. אתם יכולים להגדיר סגנון על סמך נתונים משיתוף מסלולי נסיעה או ממקורות חיצוניים:

   • נתונים משיתוף נסיעות: שיתוף נסיעות מעביר נתוני סמנים לפונקציית ההתאמה האישית, כולל סוג האובייקט שהסמן מייצג: רכב, נקודת מוצא, נקודת ביניים או יעד. העיצוב של הסמן משתנה בהתאם למצב הנוכחי של רכיב הסמן. לדוגמה, מספר נקודות הציון שנותרו עד שהרכב יסיים את הנסיעה.

   • מקורות חיצוניים: אתם יכולים לשלב את נתוני שיתוף הנסיעה עם נתונים ממקורות חיצוניים ל-Fleet Engine, ולעצב את הסמן על סמך המידע הזה.

   דוגמאות מופיעות בקטע שינוי הסגנון של סמנים באמצעות פונקציות להתאמה אישית במדריך הזה.

3. הוספת טיפול בקליקים לסמנים: דוגמאות מופיעות במאמר הוספת טיפול בקליקים.

אפשרויות להתאמה אישית של ההדגשה

שתי האפשרויות משתמשות בפרמטרים הבאים להתאמה אישית בממשק API של JavaScript במפות Google בקטע FleetEngineTripLocationProviderOptions:

• vehicleMarkerCustomization
• originMarkerCustomization
• waypointMarkerCustomization
• destinationMarkerCustomization

שינוי הסגנון של סמנים באמצעות 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.
      });
    }
  };

המאמרים הבאים

• התאמה אישית של קווי המסלול