سفارشی‌سازی چندخطی‌های مسیر

پلاتفرم را انتخاب کنید: Android iOS JavaScript

این سند نحوه سفارشی‌سازی چندخطی‌های مسیر را برای نقشه‌ای که در برنامه ردیابی سفر مبتنی بر وب خود برای کاربران مصرف‌کننده استفاده می‌کنید، پوشش می‌دهد.

با Consumer SDK، می‌توانید نمایان بودن چندخطی مسیر را کنترل کنید یا چندخطی مسیر را برای مسیر سفر در نقشه سبک‌بندی کنید. کیت توسعه نرم‌افزار یک شیء google.maps.Polyline برای هر جفت مختصات در مسیر فعال یا باقی‌مانده سفر ایجاد می‌کند. سپس کتابخانه این سفارشی‌سازی‌ها را در دو موقعیت اعمال می‌کند:

  • قبل‌از افزودن اشیا به نقشه
  • وقتی داده‌های استفاده‌شده برای اشیاء تغییر کرده باشد

سبک چندخطی‌های مسیر

همان‌طور که می‌توانید نشانگرها را سبک‌بندی کنید، می‌توانید چندخطی‌های مسیر را نیز بااستفاده از پارامترهای سفارشی‌سازی سبک‌بندی کنید. از آنجا، بااستفاده از یکی از رویکردهای زیر، سبک‌بندی را پیکربندی می‌کنید:

  • ساده‌ترین: از PolylineOptions برای اعمال به همه اشیاء Polyline منطبق هنگام ایجاد یا به‌روزرسانی آن‌ها استفاده کنید.
  • پیشرفته: تابع سفارشی‌سازی را مشخص کنید. توابع سفارشی‌سازی امکان سبک‌بندی جداگانه اشیا را براساس داده‌های ارسال‌شده توسط Fleet Engine فراهم می‌کنند. این تابع می‌تواند سبک هر شیء را براساس وضعیت فعلی سفر تغییر دهد؛ برای مثال، رنگ شیء Polyline را تیره‌تر کند یا وقتی وسیله نقلیه آهسته‌تر حرکت می‌کند، آن را ضخیم‌تر کند. حتی می‌توانید از منابع خارج از Fleet Engine دوباره بپیوندید و شیء Polyline را براساس آن اطلاعات سبک‌بندی کنید.

پارامترهای سفارشی‌سازی

هنگام سبک‌بندی چندخطی‌های مسیر، از پارامترهای ارائه‌شده در FleetEngineTripLocationProviderOptions استفاده می‌کنید. این پارامترها برای وضعیت‌های مختلف مسیر در سفر خودرو به‌صورت زیر ارائه می‌شوند:

استفاده از PolylineOptions

مثال زیر نحوه پیکربندی سبک برای شیء Polyline با PolylineOptions را نشان می‌دهد. این الگو را دنبال کنید تا سبک هر شیء Polyline را بااستفاده از هریک از سفارشی‌سازی‌های چندخطی فهرست‌شده در بالا سفارشی کنید.

JavaScript

activePolylineCustomization = {
  strokeWidth: 5,
  strokeColor: 'black',
};

TypeScript

activePolylineCustomization = {
  strokeWidth: 5,
  strokeColor: 'black',
};

استفاده از توابع سفارشی‌سازی برای سبک‌دهی به چندخطی‌های مسیر

مثال زیر نحوه پیکربندی کردن سبک برای چندخطی مسیر فعال را نشان می‌دهد. این الگو را دنبال کنید تا سبک هر شیء Polyline را بااستفاده از هریک از پارامترهای سفارشی‌سازی چندخطی مسیر که قبلاً فهرست شده است سفارشی کنید.

JavaScript

// Color the route polyline objects in green if the vehicle is nearby.
activePolylineCustomization =
  (params) => {
    const distance = params.trip.remainingWaypoints[0].distanceMeters;
    if (distance < 1000) {

      // params.polylines contains an ordered list of Polyline objects for
      // the path.
      for (const polylineObject of params.polylines) {
        polylineObject.setOptions({strokeColor: 'green'});
      }
    }
  };

TypeScript

// Color the route Polyline objects in green if the vehicle is nearby.
activePolylineCustomization =
  (params: TripPolylineCustomizationFunctionParams) => {
    const distance = params.trip.remainingWaypoints[0].distanceMeters;
    if (distance < 1000) {

      // params.polylines contains an ordered list of Polyline objects for
      // the path.
      for (const polylineObject of params.polylines) {
        polylineObject.setOptions({strokeColor: 'green'});
      }
    }
  };

کنترل رؤیت‌پذیری چندخطی مسیر

به‌طور پیش‌فرض، همه اشیاء Polyline نمایان هستند. برای نامرئی کردن شیء Polyline، خصوصیت visible آن را تنظیم کنید:

JavaScript

remainingPolylineCustomization = {visible: false};

TypeScript

remainingPolylineCustomization = {visible: false};