نشانگرها را سفارشی کنید

پلتفرم مورد نظر را انتخاب کنید: اندروید، iOS، جاوا اسکریپت

ظاهر و حس نشانگرهای اضافه شده به نقشه را سفارشی کنید. ظاهر و حس نشانگرهای اضافه شده به نقشه را به دو روش سفارشی کنید:

  1. سبک‌دهی به نشانگرها بر اساس نوع : یک شیء MarkerOptions برای سبک‌دهی به نشانگرهای هم نوع مشخص کنید. تغییراتی که مشخص می‌کنید پس از ایجاد هر نشانگر اعمال می‌شوند و گزینه‌های پیش‌فرض را بازنویسی می‌کنند. برای مثال، به بخش «تغییر سبک نشانگرها با استفاده از MarkerOptions در این راهنما مراجعه کنید.

  2. سبک‌دهی نشانگرها بر اساس داده‌ها : یک تابع سفارشی‌سازی برای سبک‌دهی نشانگرها بر اساس داده‌ها مشخص کنید. می‌توانید بر اساس داده‌های حاصل از اشتراک‌گذاری سفر یا منابع خارجی، سبک‌دهی کنید:

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

    • منابع خارجی : می‌توانید داده‌های اشتراک‌گذاری سفر را با داده‌های منابع خارج از Fleet Engine ترکیب کنید و بر اساس آن اطلاعات، نشانگر را نیز استایل‌دهی کنید.

    برای مثال، به بخش «تغییر سبک نشانگرها با استفاده از توابع سفارشی‌سازی» در این راهنما مراجعه کنید.

  3. افزودن قابلیت مدیریت کلیک به نشانگرها : برای مثال، به افزودن قابلیت مدیریت کلیک مراجعه کنید.

گزینه‌های سفارشی‌سازی نشانگر

هر دو گزینه از پارامترهای سفارشی‌سازی زیر در API جاوا اسکریپت نقشه‌های گوگل تحت FleetEngineTripLocationProviderOptions استفاده می‌کنند:

تغییر استایل نشانگرها با استفاده از MarkerOptions

مثال زیر نحوه پیکربندی سبک نشانگر وسیله نقلیه را با یک شیء MarkerOptions نشان می‌دهد. برای سفارشی‌سازی سبک هر نشانگر با استفاده از هر یک از تنظیمات نشانگر ذکر شده در گزینه‌های سفارشی‌سازی نشانگر، از این الگو پیروی کنید.

جاوا اسکریپت

deliveryVehicleMarkerCustomization = {
  cursor: 'grab'
};

تایپ اسکریپت

deliveryVehicleMarkerCustomization = {
  cursor: 'grab'
};

تغییر استایل نشانگرها با استفاده از توابع سفارشی‌سازی

مثال زیر نحوه پیکربندی سبک نشانگر وسیله نقلیه را با استفاده از توابع سفارشی‌سازی نشان می‌دهد. برای سفارشی‌سازی سبک هر نشانگر با استفاده از هر یک از پارامترهای سفارشی‌سازی نشانگر ذکر شده در گزینه‌های سفارشی‌سازی نشانگر، از این الگو پیروی کنید.

جاوا اسکریپت

vehicleMarkerCustomization =
  (params) => {
    var distance = params.trip.remainingWaypoints.length;
    params.marker.setLabel(`${distance}`);
  };

تایپ اسکریپت

vehicleMarkerCustomization =
  (params: TripMarkerCustomizationFunctionParams) => {
    const distance = params.trip.remainingWaypoints.length;
    params.marker.setLabel(`${distance}`);
};

افزودن قابلیت مدیریت کلیک به نشانگرها

مثال زیر نحوه افزودن قابلیت کنترل کلیک به نشانگر وسیله نقلیه را نشان می‌دهد. برای افزودن قابلیت کنترل کلیک به هر نشانگری با استفاده از هر یک از پارامترهای سفارشی‌سازی نشانگر که در گزینه‌های سفارشی‌سازی نشانگر ذکر شده است، از این الگو پیروی کنید.

جاوا اسکریپت

vehicleMarkerCustomization =
  (params) => {
    if (params.isNew) {
      params.marker.addListener('click', () => {
        // Perform desired action.
      });
    }
  };

تایپ اسکریپت

vehicleMarkerCustomization =
  (params: TripMarkerCustomizationFunctionParams) => {
    if (params.isNew) {
      params.marker.addListener('click', () => {
        // Perform desired action.
      });
    }
  };

قدم بعدی چیست؟