سرویس مسیرها (قدیمی)

توسعه‌دهندگان منطقه اقتصادی اروپا (EEA)
توجه: کتابخانه‌های سمت سرور

نمای کلی

می‌توانید بااستفاده از شیء DirectionsService، مسیرها را (بااستفاده از روش‌های مختلف حمل‌ونقل) محاسبه کنید. این شیء با Google Maps API Directions Service ارتباط برقرار می‌کند که درخواست‌های مسیر را دریافت می‌کند و مسیر کارآمدی را برمی‌گرداند. مدت سفر عامل اصلی است که بهینه‌سازی می‌شود، اما عوامل دیگری مثل مسافت، تعداد پیچ‌ها، و موارد بسیار دیگری ممکن است درنظر گرفته شود. می‌توانید خودتان این نتایج مسیر را مدیریت کنید یا از شیء DirectionsRenderer برای ارائه این نتایج استفاده کنید.

هنگام مشخص کردن مبدأ یا مقصد در درخواست مسیر، می‌توانید رشته پرسمان (برای مثال، «Chicago, IL» یا «Darwin, NSW, Australia»)، مقدار LatLng، یا شیء مکان را مشخص کنید.

سرویس «مسیرها» می‌تواند بااستفاده از مجموعه‌ای از نقطه‌مسیرها، مسیرهای چندبخشی را برگرداند. مسیرها به‌صورت چندخطی نمایش داده می‌شوند که مسیر را روی نقشه ترسیم می‌کند، یا علاوه‌براین به‌صورت مجموعه‌ای از توضیحات متنی در عنصر <div> (برای مثال، «به‌سمت راست در رمپ پل ویلیامزبرگ بپیچید»).

درحال شروع کردن

قبل‌از استفاده از سرویس «مسیرها» در Maps JavaScript API، ابتدا مطمئن شوید که Directions API (Legacy) در کنسول Google Cloud، در همان پروژه‌ای که برای Maps JavaScript API راه‌اندازی کرده‌اید، فعال باشد.

برای مشاهده فهرست میاناهای برنامه‌سازی کاربردی فعال‌شده:

  1. به کنسول Google Cloud بروید.
  2. روی دکمه انتخاب پروژه کلیک کنید، سپس همان پروژه‌ای را که برای میانای برنامه‌سازی کاربردی جاوا اسکریپت در Maps راه‌اندازی کرده‌اید انتخاب کنید و روی باز کردن کلیک کنید.
  3. از فهرست میاناهای برنامه‌سازی کاربردی در داشبورد، Directions API (قدیمی) را پیدا کنید.
  4. اگر API را در فهرست می‌بینید، همه چیز آماده است. اگر میانای برنامه‌سازی کاربردی فهرست نشده است، آن را در https://console.cloud.google.com/apis/library/directions-backend.googleapis.com فعال کنید

قیمت‌گذاری و خط‌مشی‌ها

قیمت‌گذاری

برای آشنایی با خط‌مشی‌های قیمت‌گذاری و استفاده برای سرویس JavaScript Directions، به استفاده و صورت‌حساب برای Directions API (قدیمی) مراجعه کنید.

خط‌مشی‌ها

استفاده از سرویس «مسیرها» باید مطابق با خط‌مشی‌های شرح‌داده‌شده برای Directions API (Legacy) باشد.

درخواست‌های مسیر

دسترسی به سرویس «مسیرها» ناهمگام است، زیرا Google Maps API باید با سرور خارجی تماس برقرار کند. به همین دلیل، باید روش فراخوانی را برای اجرا پس‌از تکمیل درخواست ارسال کنید. این روش فراخوانی باید نتیجه(ها) را پردازش کند. توجه داشته باشید که سرویس «مسیرها» ممکن است بیش‌از یک برنامه سفر احتمالی را به‌صورت آرایه‌ای از routes[] جداگانه برگرداند.

برای استفاده از مسیرها در Maps JavaScript API، شیئی از نوع DirectionsService ایجاد کنید و DirectionsService.route() را فراخوانی کنید تا درخواستی به سرویس «مسیرها» ارسال شود، و یک راستین‌نماد شیء DirectionsRequest حاوی عبارت‌های ورودی و یک روش فراخوانی برای اجرا پس‌از دریافت پاسخ به آن ارسال کنید.

راستین‌نماد شیء DirectionsRequest شامل فیلدهای زیر است:

{
  origin: LatLng | String | google.maps.Place,
  destination: LatLng | String | google.maps.Place,
  travelMode: TravelMode,
  transitOptions: TransitOptions,
  drivingOptions: DrivingOptions,
  unitSystem: UnitSystem,
  waypoints[]: DirectionsWaypoint,
  optimizeWaypoints: Boolean,
  provideRouteAlternatives: Boolean,
  avoidFerries: Boolean,
  avoidHighways: Boolean,
  avoidTolls: Boolean,
  region: String
}

این فیلدها در زیر توضیح داده شده‌اند:

  • ‫origin (الزامی) مکان شروع را که مسیرها از آن محاسبه می‌شود مشخص می‌کند. این مقدار ممکن است به‌صورت String (برای مثال، «Chicago, IL»)، به‌صورت مقدار LatLng یا به‌صورت شیء مکان مشخص شود. اگر از شیء مکان استفاده می‌کنید، می‌توانید شناسه مکان، رشته پُرسمان، یا LatLng مکان را مشخص کنید. می‌توانید شناسه‌های مکان را از سرویس‌های Geocoding،‏ Place Search، و Place Autocomplete در Maps JavaScript API بازیابی کنید. برای نمونه‌ای از استفاده از شناسه‌های جا از «تکمیل خودکار جا»، تکمیل خودکار جا و مسیرها را ببینید.
  • ‫destination (الزامی) مکان پایانی را که باید مسیرها به آن محاسبه شود مشخص می‌کند. گزینه‌ها همان گزینه‌های فیلد origin است که در بالا شرح داده شد.
  • ‫travelMode (الزامی) مشخص می‌کند که هنگام محاسبه مسیرها از چه حالت حمل‌ونقلی استفاده شود. مقادیر معتبر در حالت‌های سفر در زیر مشخص شده است.
  • transitOptions (اختیاری) مقادیری را مشخص می‌کند که فقط برای درخواست‌هایی اعمال می‌شود که travelMode در آن‌ها TRANSIT است. مقادیر معتبر در بخش گزینه‌های حمل‌ونقل عمومی در زیر شرح داده شده است.
  • drivingOptions (اختیاری) مقادیری را مشخص می‌کند که فقط برای درخواست‌هایی اعمال می‌شود که travelMode در آن‌ها DRIVING است. مقادیر معتبر در بخش گزینه‌های رانندگی در زیر شرح داده شده است.

  • ‫unitSystem (اختیاری) مشخص می‌کند که هنگام نمایش نتایج از چه سیستم واحدی استفاده شود. مقادیر معتبر در سیستم‌های واحد زیر مشخص شده است.

  • ‫waypoints[] (اختیاری) آرایه‌ای از DirectionsWaypoint را مشخص می‌کند. نقطه‌مسیرها مسیر را با مسیریابی ازطریق مکان(های) مشخص‌شده تغییر می‌دهند. نقطه‌مسیر به‌عنوان راستین‌نماد شیء با فیلدهای نشان‌داده‌شده در زیر مشخص می‌شود:

    • location مکان نقطه‌مسیر را به‌عنوان LatLng، به‌عنوان شیء Place، یا به‌عنوان String که زمین‌کدیابی خواهد شد مشخص می‌کند.
    • stopover یک بولی است که نشان می‌دهد نقطه‌مسیر یک ایستگاه در مسیر است که تأثیر آن تقسیم مسیر به دو مسیر است.

    (برای اطلاعات بیشتر درباره نقاط‌مسیر، به استفاده از نقاط‌مسیر در مسیرها در زیر مراجعه کنید.)

  • ‫optimizeWaypoints (اختیاری) مشخص می‌کند که مسیر بااستفاده از waypoints ارائه‌شده ممکن است با مرتب کردن مجدد نقاط‌مسیر به ترتیبی کارآمدتر بهینه‌سازی شود. اگر true، سرویس «مسیرها» waypoints مرتب‌شده را در فیلد waypoint_order برمی‌گرداند.(برای اطلاعات بیشتر، به استفاده از نقاط‌مسیر در مسیرها در زیر مراجعه کنید.)
  • provideRouteAlternatives (اختیاری) وقتی روی true تنظیم شده باشد، مشخص می‌کند که سرویس «مسیرها» ممکن است بیش‌از یک مسیر جایگزین در پاسخ ارائه دهد. توجه داشته باشید که ارائه مسیرهای جایگزین ممکن است زمان پاسخ‌دهی سرور را افزایش دهد. این ویژگی فقط برای درخواست‌های بدون نقطه‌مسیرهای میانی دردسترس است.
  • ‫avoidFerries (اختیاری) وقتی روی true تنظیم شود، نشان می‌دهد که مسیر(های) محاسبه‌شده باید درصورت امکان از کشتی‌های مسافربری اجتناب کنند.
  • ‫avoidHighways (اختیاری) وقتی روی true تنظیم شده باشد، نشان می‌دهد که مسیر(های) محاسبه‌شده باید درصورت امکان از بزرگراه‌های اصلی اجتناب کند.
  • ‫avoidTolls (اختیاری) وقتی روی true تنظیم شود، نشان می‌دهد که مسیر(های) محاسبه‌شده باید درصورت امکان از جاده‌های عوارضی اجتناب کند.
  • region (اختیاری) کد منطقه را مشخص می‌کند که به‌صورت مقدار دو نویسه‌ای ccTLD («دامنه سطح بالا») مشخص می‌شود. (برای اطلاعات بیشتر، سوگیری منطقه‌ای را در زیر ببینید.)

در زیر نمونه‌ای از DirectionsRequest آمده است:

{
  origin: 'Chicago, IL',
  destination: 'Los Angeles, CA',
  waypoints: [
    {
      location: 'Joplin, MO',
      stopover: false
    },{
      location: 'Oklahoma City, OK',
      stopover: true
    }],
  provideRouteAlternatives: false,
  travelMode: 'DRIVING',
  drivingOptions: {
    departureTime: new Date(/* now, or future date */),
    trafficModel: 'pessimistic'
  },
  unitSystem: google.maps.UnitSystem.IMPERIAL
}

حالت‌های سفر

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

  • DRIVING (پیش‌فرض) نشان‌دهنده مسیرهای رانندگی استاندارد بااستفاده از شبکه جاده‌ای است.
  • BICYCLING درخواست مسیرهای دوچرخه‌سواری ازطریق مسیرهای دوچرخه و خیابان‌های ترجیحی را دارد.
  • TRANSIT درخواست مسیر ازطریق مسیرهای حمل‌ونقل عمومی می‌کند.
  • WALKING درخواست مسیر پیاده‌روی ازطریق مسیرهای پیاده‌روی و پیاده‌روها را دارد.

برای تعیین اینکه یک کشور تا چه حد از مسیرها پشتیبانی می‌کند، جزئیات پوشش پلاتفرم Google Maps را بررسی کنید. اگر برای منطقه‌ای که آن نوع مسیر در آن دردسترس نیست درخواست مسیر کنید، پاسخ DirectionsStatus="ZERO_RESULTS" را برمی‌گرداند.

توجه: مسیرهای پیاده‌روی ممکن است شامل مسیرهای عابر پیاده واضح نباشد، بنابراین مسیرهای پیاده‌روی هشدارهایی را در DirectionsResult برمی‌گرداند. این هشدارها باید همیشه به کاربر نشان داده شود. اگر از DirectionsRenderer پیش‌فرض استفاده نمی‌کنید، مسئولیت اطمینان از نمایش هشدارها برعهده شما است.

گزینه‌های حمل‌ونقل عمومی

گزینه‌های دردسترس برای درخواست مسیر در حالت‌های سفر متفاوت است. هنگام درخواست مسیرهای حمل‌ونقل عمومی، گزینه‌های avoidHighways، avoidTolls، waypoints[]، و optimizeWaypoints نادیده گرفته خواهند شد. می‌توانید گزینه‌های مسیریابی خاص حمل‌ونقل عمومی را ازطریق راستین‌نماد شیء TransitOptions مشخص کنید.

مسیرهای حمل‌ونقل عمومی به زمان حساس هستند. مسیرها فقط برای زمان‌های آینده برگردانده می‌شود.

راستین‌نماد شیء TransitOptions شامل فیلدهای زیر است:

{
  arrivalTime: Date,
  departureTime: Date,
  modes[]: TransitMode,
  routingPreference: TransitRoutePreference
}

این فیلدها در زیر توضیح داده شده‌اند:

  • arrivalTime (اختیاری) زمان ورود موردنظر را به‌عنوان شیء Date مشخص می‌کند. اگر زمان رسیدن مشخص شده باشد، زمان حرکت نادیده گرفته می‌شود.
  • departureTime (اختیاری) زمان حرکت موردنظر را به‌عنوان شیء Date مشخص می‌کند. اگر arrivalTime مشخص شده باشد، departureTime نادیده گرفته خواهد شد. اگر مقداری برای departureTime یا arrivalTime مشخص نشده باشد، به‌طور پیش‌فرض روی «اکنون» (یعنی زمان فعلی) تنظیم می‌شود.
  • ‫modes[] (اختیاری) آرایه‌ای است که حاوی یک یا چند راستین‌نماد شیء TransitMode است. این فیلد فقط درصورتی می‌تواند گنجانده شود که درخواست حاوی کلید میانای برنامه‌سازی کاربردی باشد. هر TransitMode حالت ترجیحی حمل‌ونقل عمومی را مشخص می‌کند. مقادیر زیر مجاز هستند:
    • BUS نشان می‌دهد که مسیر محاسبه‌شده باید سفر با اتوبوس را ترجیح دهد.
    • RAIL نشان می‌دهد که مسیر محاسبه‌شده باید سفر با قطار، تراموا، قطار شهری، و مترو را ترجیح دهد.
    • SUBWAY نشان می‌دهد که مسیر محاسبه‌شده باید سفر با مترو را ترجیح دهد.
    • TRAIN نشان می‌دهد که مسیر محاسبه‌شده باید سفر با قطار را ترجیح دهد.
    • TRAM نشان می‌دهد که مسیر محاسبه‌شده باید سفر با تراموا و قطار شهری را ترجیح دهد.
  • ‫routingPreference (اختیاری) اولویت‌ها را برای مسیرهای حمل‌ونقل عمومی مشخص می‌کند. بااستفاده از این گزینه، می‌توانید گزینه‌های برگردانده‌شده را سوگیری کنید، به‌جای اینکه بهترین مسیر پیش‌فرض انتخاب‌شده توسط API را بپذیرید. این فیلد فقط درصورتی می‌تواند مشخص شود که درخواست حاوی کلید میانای برنامه‌سازی کاربردی باشد. مقادیر زیر مجاز هستند:
    • FEWER_TRANSFERS نشان می‌دهد که مسیر محاسبه‌شده باید تعداد محدودی تعویض وسیله داشته باشد.
    • LESS_WALKING نشان می‌دهد که مسیر محاسبه‌شده باید مقدار محدودی پیاده‌روی داشته باشد.

نمونه‌ای از DirectionsRequest با حمل‌ونقل عمومی در زیر نشان داده شده است:

{
  origin: 'Hoboken NJ',
  destination: 'Carroll Gardens, Brooklyn',
  travelMode: 'TRANSIT',
  transitOptions: {
    departureTime: new Date(1337675679473),
    modes: ['BUS'],
    routingPreference: 'FEWER_TRANSFERS'
  },
  unitSystem: google.maps.UnitSystem.IMPERIAL
}

گزینه‌های رانندگی

می‌توانید گزینه‌های مسیریابی را برای مسیرهای رانندگی ازطریق شیء DrivingOptions مشخص کنید.

شیء DrivingOptions حاوی فیلدهای زیر است:

{
  departureTime: Date,
  trafficModel: TrafficModel
}

این فیلدها در زیر توضیح داده شده‌اند:

  • departureTime (برای معتبر بودن راستین‌نماد شیء drivingOptions الزامی است) زمان حرکت موردنظر را به‌عنوان شیء Date مشخص می‌کند. مقدار باید روی زمان فعلی یا زمانی در آینده تنظیم شود. نمی‌تواند در گذشته باشد. (میانای برنامه‌سازی کاربردی همه تاریخ‌ها را به ساعت هماهنگ جهانی تبدیل می‌کند تا از مدیریت یکسان در مناطق زمانی مختلف مطمئن شود.) برای مشتریان «طرح Google Maps Platform Premium»، اگر departureTime را در درخواست بگنجانید، میانای برنامه‌سازی کاربردی بهترین مسیر را با توجه به شرایط ترافیک موردانتظار در آن زمان برمی‌گرداند و زمان پیش‌بینی‌شده در ترافیک (duration_in_traffic) را در پاسخ لحاظ می‌کند. اگر زمان حرکت را مشخص نکنید (یعنی اگر درخواست شامل drivingOptions نباشد)، مسیر برگردانده‌شده معمولاً مسیر خوبی است که شرایط ترافیک در آن درنظر گرفته نشده است.
  • ‫trafficModel (اختیاری) فرضیاتی را که باید هنگام محاسبه زمان در ترافیک استفاده شود مشخص می‌کند. این تنظیم بر مقدار برگردانده‌شده در فیلد duration_in_traffic در پاسخ تأثیر می‌گذارد، که حاوی زمان پیش‌بینی‌شده در ترافیک براساس میانگین‌های سابقه است. پیش‌فرض‌ها به bestguess. مقادیر زیر مجاز هستند:
    • bestguess (پیش‌فرض) نشان می‌دهد که duration_in_traffic برگردانده‌شده باید بهترین تخمین از مدت سفر بااستفاده از اطلاعات موجود درباره شرایط ترافیک گذشته و ترافیک زنده باشد. هرچه departureTime به زمان فعلی نزدیک‌تر باشد، ترافیک زنده مهم‌تر می‌شود.
    • pessimistic نشان می‌دهد که duration_in_traffic برگردانده‌شده باید در اکثر روزها طولانی‌تر از مدت سفر واقعی باشد، اگرچه در برخی روزها با شرایط ترافیکی بسیار بد ممکن است از این مقدار فراتر رود.
    • optimistic نشان می‌دهد که duration_in_traffic برگردانده‌شده باید در اکثر روزها کوتاه‌تر از مدت سفر واقعی باشد، هرچند در روزهایی که شرایط ترافیک به‌طور خاص خوب است، ممکن است سریع‌تر از این مقدار باشد.

در زیر نمونه‌ای از DirectionsRequest برای مسیرهای رانندگی آورده شده است:

{
  origin: 'Chicago, IL',
  destination: 'Los Angeles, CA',
  travelMode: 'DRIVING',
  drivingOptions: {
    departureTime: new Date(Date.now() + N),  // for the time N milliseconds from now.
    trafficModel: 'optimistic'
  }
}

سیستم‌های واحد

به‌طور پیش‌فرض، مسیرها بااستفاده از سیستم واحد کشور یا منطقه مبدأ محاسبه و نمایش داده می‌شوند. (توجه: مبدأهایی که بااستفاده از مختصات عرض/ طول جغرافیایی به‌جای نشانی بیان می‌شوند، همیشه به‌طور پیش‌فرض از واحدهای متریک استفاده می‌کنند.) برای مثال، مسیری از «شیکاگو، ایلینوی» به «تورنتو، انتاریو» نتایج را به مایل نمایش می‌دهد، درحالی‌که مسیر برعکس نتایج را به کیلومتر نمایش می‌دهد. می‌توانید این سیستم واحد را با تنظیم صریح یکی از آن‌ها در درخواست بااستفاده از یکی از مقادیر UnitSystem زیر لغو کنید:

  • UnitSystem.METRIC استفاده از سیستم متریک را مشخص می‌کند. مسافت‌ها بااستفاده از کیلومتر نشان داده می‌شود.
  • UnitSystem.IMPERIAL استفاده از سیستم امپریال (انگلیسی) را مشخص می‌کند. مسافت‌ها بااستفاده از مایل نشان داده می‌شود.

توجه: این تنظیم سیستم واحد فقط بر نوشتار نمایش‌داده‌شده به کاربر تأثیر می‌گذارد. نتیجه مسیرها همچنین حاوی مقادیر مسافت است که به کاربر نشان داده نمی‌شود و همیشه برحسب متر بیان می‌شود.

سوگیری منطقه برای مسیرها

سرویس مسیرهای Google Maps API نتایج نشانی را تحت تأثیر دامنه‌ای (منطقه یا کشور) که راه‌انداز جاوا اسکریپت را از آن بار کرده‌اید برمی‌گرداند. (ازآنجایی‌که اکثر کاربران https://maps.googleapis.com/ را بار می‌کنند، این کار دامنه‌ای ضمنی برای ایالات متحده تنظیم می‌کند.) اگر راه‌انداز را از دامنه پشتیبانی‌شده دیگری بار کنید، نتایجی دریافت خواهید کرد که تحت تأثیر آن دامنه است. برای مثال، جستجوی «سان فرانسیسکو» ممکن است نتایج متفاوتی را از برنامه‌هایی که https://maps.googleapis.com/ (ایالات متحده) را بار می‌کنند نسبت به برنامه‌ای که http://maps.google.es/ (اسپانیا) را بار می‌کند برگرداند.

همچنین می‌توانید سرویس «مسیرها» را طوری تنظیم کنید که نتایج را بااستفاده از پارامتر region به منطقه خاصی متمایل کند. این پارامتر کد منطقه را می‌گیرد که به‌عنوان برچسب فرعی منطقه «یونی‌کد» دو نویسه‌ای (غیرعددی) مشخص شده است. در بیشتر موارد، این برچسب‌ها مستقیماً به مقادیر دو نویسه‌ای ccTLD («دامنه سطح بالا») نگاشت می‌شوند، مثلاً «uk» در «co.uk». در برخی موارد، برچسب region از کدهای ISO-3166-1 نیز پشتیبانی می‌کند که گاهی با مقادیر ccTLD متفاوت است (برای مثال، «GB» برای «بریتانیای کبیر»).

هنگام استفاده از پارامتر region:

  • فقط یک کشور یا منطقه را مشخص کنید. مقادیر متعدد نادیده گرفته می‌شود و می‌تواند منجر به ناموفق شدن درخواست شود.
  • فقط از برچسب‌های فرعی منطقه دو نویسه‌ای (قالب Unicode CLDR) استفاده کنید. همه ورودی‌های دیگر منجر به خطا خواهد شد.

سوگیری منطقه فقط برای کشورها و مناطقی که از مسیرها پشتیبانی می‌کنند پشتیبانی می‌شود. برای دیدن پوشش بین‌المللی Directions API (Legacy)، به جزئیات پوشش پلاتفرم Google Maps مراجعه کنید.

درحال پرداز زدن مسیرها

برای شروع درخواست مسیر به DirectionsService با روش route() باید یک فراخوانی برگشتی ارسال شود که پس‌از تکمیل درخواست سرویس اجرا می‌شود. این فراخوانی برگشتی یک DirectionsResult و یک کد DirectionsStatus در پاسخ برمی‌گرداند.

وضعیت پُرسمان مسیرها

DirectionsStatus ممکن است مقادیر زیر را برگرداند:

  • OK نشان می‌دهد که پاسخ حاوی DirectionsResult معتبر است.
  • NOT_FOUND نشان می‌دهد که حداقل یکی از مکان‌های مشخص‌شده در مبدأ، مقصد، یا نقطه‌مسیرهای درخواست زمین‌کدیابی نشده است.
  • ZERO_RESULTS نشان می‌دهد که هیچ مسیری بین مبدأ و مقصد پیدا نشد.
  • MAX_WAYPOINTS_EXCEEDED نشان می‌دهد که فیلدهای DirectionsWaypoint بسیار زیادی در DirectionsRequest ارائه شده است. بخش زیر را درباره محدودیت‌های نقاط بین‌راهی ببینید.
  • MAX_ROUTE_LENGTH_EXCEEDED نشان می‌دهد مسیر درخواست‌شده خیلی طولانی است و نمی‌توان آن را پردازش کرد. این خطا زمانی رخ می‌دهد که مسیرهای پیچیده‌تری برگردانده شود. تعداد نقطه‌مسیرها، پیچ‌ها، یا دستورالعمل‌ها را کاهش دهید.
  • INVALID_REQUEST نشان می‌دهد که DirectionsRequest ارائه‌شده نامعتبر است. رایج‌ترین دلایل این کد خطا درخواست‌هایی هستند که مبدأ یا مقصد ندارند، یا درخواست حمل‌ونقل عمومی که شامل نقطه‌مسیر است.
  • OVER_QUERY_LIMIT نشان می‌دهد که صفحه وب درخواست‌های بسیار زیادی در دوره زمانی مجاز ارسال کرده است.
  • REQUEST_DENIED نشان می‌دهد که صفحه وب اجازه ندارد از سرویس مسیرها استفاده کند.
  • UNKNOWN_ERROR نشان می‌دهد که درخواست مسیر به‌دلیل خطای سرور پردازش نشد. اگر دوباره امتحان کنید، ممکن است درخواست موفقیت‌آمیز باشد.

باید مطمئن شوید که پُرسمان مسیرها نتایج معتبری را برگردانده است و این مقدار را قبل‌از پردازش نتیجه بررسی کنید.

نمایش DirectionsResult

DirectionsResult حاوی نتیجه پُرسمان مسیرها است که می‌توانید خودتان آن را مدیریت کنید یا به شیء DirectionsRenderer ارسال کنید که می‌تواند به‌طور خودکار نمایش نتیجه را در نقشه مدیریت کند.

برای نمایش DirectionsResult بااستفاده از DirectionsRenderer، باید کارهای زیر را انجام دهید:

  1. یک شیء DirectionsRenderer ایجاد کنید.
  2. setMap() را در پردازنده فراخوانی کنید تا آن را به نقشه ارسال‌شده متصل کنید.
  3. ‫setDirections() را در پردازنده فراخوانی کنید، و DirectionsResult را همان‌طور که در بالا ذکر شد به آن ارسال کنید. چون رندرکننده MVCObject است، هرگونه تغییر در ویژگی‌هایش را به‌طور خودکار شناسایی می‌کند و وقتی مسیرهای مرتبط با آن تغییر کند، نقشه را به‌روز می‌کند.

مثال زیر مسیر بین دو مکان را در Route 66 محاسبه می‌کند، که در آن مبدأ و مقصد با مقادیر "start" و "end" داده‌شده در فهرست‌های کرکره‌ای تنظیم شده‌اند. DirectionsRenderer نمایش چندخطی بین مکان‌های مشخص‌شده و قرار دادن نشانگرها در مبدأ، مقصد، و هر نقطه‌مسیر را (درصورت وجود) مدیریت می‌کند.

function initMap() {
  var directionsService = new google.maps.DirectionsService();
  var directionsRenderer = new google.maps.DirectionsRenderer();
  var chicago = new google.maps.LatLng(41.850033, -87.6500523);
  var mapOptions = {
    zoom:7,
    center: chicago
  }
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);
  directionsRenderer.setMap(map);
}

function calcRoute() {
  var start = document.getElementById('start').value;
  var end = document.getElementById('end').value;
  var request = {
    origin: start,
    destination: end,
    travelMode: 'DRIVING'
  };
  directionsService.route(request, function(result, status) {
    if (status == 'OK') {
      directionsRenderer.setDirections(result);
    }
  });
}

در بدنه HTML:

<div>
<strong>Start: </strong>
<select id="start" onchange="calcRoute();">
  <option value="chicago, il">Chicago</option>
  <option value="st louis, mo">St Louis</option>
  <option value="joplin, mo">Joplin, MO</option>
  <option value="oklahoma city, ok">Oklahoma City</option>
  <option value="amarillo, tx">Amarillo</option>
  <option value="gallup, nm">Gallup, NM</option>
  <option value="flagstaff, az">Flagstaff, AZ</option>
  <option value="winona, az">Winona</option>
  <option value="kingman, az">Kingman</option>
  <option value="barstow, ca">Barstow</option>
  <option value="san bernardino, ca">San Bernardino</option>
  <option value="los angeles, ca">Los Angeles</option>
</select>
<strong>End: </strong>
<select id="end" onchange="calcRoute();">
  <option value="chicago, il">Chicago</option>
  <option value="st louis, mo">St Louis</option>
  <option value="joplin, mo">Joplin, MO</option>
  <option value="oklahoma city, ok">Oklahoma City</option>
  <option value="amarillo, tx">Amarillo</option>
  <option value="gallup, nm">Gallup, NM</option>
  <option value="flagstaff, az">Flagstaff, AZ</option>
  <option value="winona, az">Winona</option>
  <option value="kingman, az">Kingman</option>
  <option value="barstow, ca">Barstow</option>
  <option value="san bernardino, ca">San Bernardino</option>
  <option value="los angeles, ca">Los Angeles</option>
</select>
</div>

مشاهده نمونه

مثال زیر مسیرها را بااستفاده از حالت‌های مختلف سفر بین «هایت-اشبری» تا «اوشن بیچ» در سانفرانسیسکو، کالیفرنیا نشان می‌دهد:

function initMap() {
  var directionsService = new google.maps.DirectionsService();
  var directionsRenderer = new google.maps.DirectionsRenderer();
  var haight = new google.maps.LatLng(37.7699298, -122.4469157);
  var oceanBeach = new google.maps.LatLng(37.7683909618184, -122.51089453697205);
  var mapOptions = {
    zoom: 14,
    center: haight
  }
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);
  directionsRenderer.setMap(map);
}

function calcRoute() {
  var selectedMode = document.getElementById('mode').value;
  var request = {
      origin: haight,
      destination: oceanBeach,
      // Note that JavaScript allows us to access the constant
      // using square brackets and a string value as its
      // "property."
      travelMode: google.maps.TravelMode[selectedMode]
  };
  directionsService.route(request, function(response, status) {
    if (status == 'OK') {
      directionsRenderer.setDirections(response);
    }
  });
}

در بدنه HTML:

<div>
<strong>Mode of Travel: </strong>
<select id="mode" onchange="calcRoute();">
  <option value="DRIVING">Driving</option>
  <option value="WALKING">Walking</option>
  <option value="BICYCLING">Bicycling</option>
  <option value="TRANSIT">Transit</option>
</select>
</div>

مشاهده نمونه

DirectionsRenderer نه‌تنها نمایش چندخطی و هر نشانگر مرتبط را مدیریت می‌کند، بلکه می‌تواند نمایش متنی مسیرها را به‌عنوان مجموعه‌ای از مراحل نیز مدیریت کند. برای انجام این کار، setPanel() را در DirectionsRenderer خود فراخوانی کنید و <div> را که این اطلاعات در آن نمایش داده می‌شود به آن ارسال کنید. انجام این کار همچنین تضمین می‌کند که اطلاعات حق نشر مناسب و هرگونه هشداری را که ممکن است با نتیجه مرتبط باشد نمایش دهید.

مسیرهای متنی بااستفاده از تنظیمات زبان برگزیده مرورگر یا زبان مشخص‌شده هنگام بار کردن API JavaScript بااستفاده از پارامتر language ارائه خواهد شد. (برای اطلاعات بیشتر، به بومی‌سازی مراجعه کنید.) درمورد مسیرهای حمل‌ونقل عمومی، زمان در منطقه زمانی آن ایستگاه حمل‌ونقل عمومی نمایش داده خواهد شد.

مثال زیر با مثال نشان‌داده‌شده در بالا یکسان است، اما شامل پانل <div> است که در آن مسیرها نمایش داده می‌شود:

function initMap() {
  var directionsService = new google.maps.DirectionsService();
  var directionsRenderer = new google.maps.DirectionsRenderer();
  var chicago = new google.maps.LatLng(41.850033, -87.6500523);
  var mapOptions = {
    zoom:7,
    center: chicago
  }
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);
  directionsRenderer.setMap(map);
  directionsRenderer.setPanel(document.getElementById('directionsPanel'));
}

function calcRoute() {
  var start = document.getElementById('start').value;
  var end = document.getElementById('end').value;
  var request = {
    origin:start,
    destination:end,
    travelMode: 'DRIVING'
  };
  directionsService.route(request, function(response, status) {
    if (status == 'OK') {
      directionsRenderer.setDirections(response);
    }
  });
}

در بدنه HTML:

<div id="map" style="float:left;width:70%;height:100%"></div>
<div id="directionsPanel" style="float:right;width:30%;height:100%"></div>

مشاهده نمونه

شیء DirectionsResult

هنگام ارسال درخواست مسیر به DirectionsService، پاسخی دریافت می‌کنید که شامل کد وضعیت و نتیجه است که یک شیء DirectionsResult است. ‫DirectionsResult یک راستین‌نماد شیء با فیلدهای زیر است:

  • geocoded_waypoints[] حاوی آرایه‌ای از اشیاء DirectionsGeocodedWaypoint است که هرکدام حاوی جزئیاتی درباره زمین‌کدیابی مبدأ، مقصد، و نقطه‌مسیرها است.
  • routes[] حاوی آرایه‌ای از اشیاء DirectionsRoute است. هر مسیر نشان‌دهنده راهی برای رسیدن از مبدأ به مقصد ارائه‌شده در DirectionsRequest است. به‌طور کلی، فقط یک مسیر برای هر درخواست داده‌شده برگردانده می‌شود، مگراینکه فیلد provideRouteAlternatives درخواست روی true تنظیم شده باشد که در این صورت، ممکن است چند مسیر برگردانده شود.

توجه: ویژگی via_waypoint در مسیرهای جایگزین منسوخ شده است. نسخه ۳.۲۷ آخرین نسخه API است که نقاط‌مسیر اضافی را در مسیرهای جایگزین اضافه می‌کند. برای نسخه‌های ۳.۲۸ و بالاتر API، می‌توانید با غیرفعال کردن کشیدن مسیرهای جایگزین، به پیاده‌سازی مسیرهای قابل‌کشیدن بااستفاده از سرویس «مسیرها» ادامه دهید. فقط مسیر اصلی باید کشیدنی باشد. کاربران می‌توانند مسیر اصلی را بکشند تا با مسیر جایگزین مطابقت پیدا کند.

نقاط‌مسیر زمین‌کدیابی‌شده مسیرها

DirectionsGeocodedWaypoint حاوی جزئیاتی درباره زمین‌کدیابی مبدأ، مقصد، و نقطه‌مسیرها است.

‫DirectionsGeocodedWaypoint یک راستین‌نماد شیء با فیلدهای زیر است:

  • geocoder_status نشان‌دهنده رمز وضعیت حاصل از عملیات زمین‌کدیابی است. این فیلد ممکن است حاوی مقادیر زیر باشد.
    • "OK" نشان می‌دهد که خطایی رخ نداده است؛ نشانی باموفقیت تجزیه شده است و حداقل یک زمین‌کد برگردانده شده است.
    • "ZERO_RESULTS" نشان می‌دهد که زمین‌کدیابی موفقیت‌آمیز بوده است اما نتیجه‌ای برنگردانده است. این خطا ممکن است زمانی رخ دهد که address ناموجودی به زمین‌کدیاب ارسال شده باشد.

  • partial_match نشان می‌دهد که زمین‌کدیاب مطابقت دقیقی برای درخواست اصلی برنگردانده است، هرچند توانسته است با بخشی از نشانی درخواستی مطابقت داشته باشد. شاید بخواهید درخواست اصلی را ازنظر غلط املایی و/یا نشانی ناقص بررسی کنید.

    مطابقت‌های جزئی اغلب برای نشانی‌های خیابانی رخ می‌دهد که در منطقه‌ای که در درخواست ارسال می‌کنید وجود ندارند. وقتی درخواستی با دو یا چند مکان در یک محل مطابقت داشته باشد، ممکن است مطابقت‌های جزئی نیز برگردانده شود. برای مثال، «Hillpar St, Bristol, UK» مطابقت جزئی برای هر دو Henry Street و Henrietta Street برمی‌گرداند. توجه داشته باشید که اگر درخواستی شامل مؤلفه نشانی با املای نادرست باشد، سرویس زمین‌کدیابی ممکن است نشانی جایگزینی را پیشنهاد دهد. پیشنهادهایی که به این روش راه‌اندازی می‌شوند نیز به‌عنوان مطابقت جزئی علامت‌گذاری خواهند شد.

  • place_idشناسه یکتای مکان است که می‌توان از آن با دیگر میاناهای برنامه‌سازی کاربردی Google استفاده کرد. برای مثال، می‌توانید از place_id با کتابخانه میانای برنامه‌سازی کاربردی Google Places استفاده کنید تا جزئیات کسب‌وکار محلی، مثل شماره تلفن، ساعت کاری، مرورهای کاربر، و غیره را دریافت کنید. نمای کلی شناسه مکان را ببینید.
  • types[] آرایه‌ای است که نوع نتیجه برگردانده‌شده را نشان می‌دهد. این آرایه حاوی مجموعه‌ای از صفر یا چند برچسب است که نوع عارضه برگردانده‌شده در نتیجه را شناسایی می‌کند. برای مثال، زمین‌کدیاب «شیکاگو» «محل» را برمی‌گرداند که نشان می‌دهد «شیکاگو» یک شهر است، و همچنین «سیاسی» را برمی‌گرداند که نشان می‌دهد یک نهاد سیاسی است.

مسیرهای جهت‌ها

توجه: نام شیء قدیمی DirectionsTrip به DirectionsRoute تغییر کرده است. توجه داشته باشید که اکنون مسیر به کل سفر از ابتدا تا انتها اشاره دارد، نه صرفاً به یک بخش از سفر اصلی.

DirectionsRoute حاوی یک نتیجه از مبدأ و مقصد مشخص‌شده است. این مسیر ممکن است شامل یک یا چند بخش (از نوع DirectionsLeg) باشد بسته به اینکه آیا نقطه‌مسیرهایی مشخص شده‌اند یا نه. همچنین، مسیر حاوی اطلاعات حق نشر و هشدار است که باید علاوه‌بر اطلاعات مسیریابی به کاربر نمایش داده شود.

‫DirectionsRoute یک راستین‌نماد شیء با فیلدهای زیر است:

  • legs[] حاوی آرایه‌ای از اشیاء DirectionsLeg است که هرکدام حاوی اطلاعاتی درباره یک بخش از مسیر، از دو مکان در مسیر داده‌شده است. برای هر نقطه‌مسیر یا مقصد مشخص‌شده، یک بخش جداگانه وجود خواهد داشت. (مسیر بدون نقطه‌مسیر دقیقاً شامل یک DirectionsLeg خواهد بود.) هر بخش شامل مجموعه‌ای از DirectionStep است.
  • waypoint_order حاوی آرایه‌ای است که ترتیب نقاط‌مسیر را در مسیر محاسبه‌شده نشان می‌دهد. اگر DirectionsRequest به‌صورت optimizeWaypoints: true ارسال شده باشد، این آرایه ممکن است حاوی ترتیب تغییریافته باشد.
  • overview_path حاوی آرایه‌ای از LatLng است که مسیر تقریبی (هموارشده) مسیرهای حاصل را نشان می‌دهد.
  • overview_polyline حاوی یک شیء points است که نمایش چندخطی کدبندی‌شده مسیر را نگه می‌دارد. این چندخطی مسیر تقریبی (هموارشده) مسیرهای حاصل است.
  • bounds حاوی LatLngBounds است که مرزهای چندخطی را درطول این مسیر مشخص‌شده نشان می‌دهد.
  • copyrights حاوی نوشتار حق نشر است که باید برای این مسیر نمایش داده شود.
  • warnings[] حاوی آرایه‌ای از هشدارها است که هنگام نمایش این مسیرها نشان داده می‌شود. اگر از شیء DirectionsRenderer ارائه‌شده استفاده نمی‌کنید، باید خودتان این هشدارها را مدیریت و نمایش دهید.
  • fare حاوی کل کرایه (یعنی کل هزینه بلیت) در این مسیر است. این ویژگی فقط برای درخواست‌های حمل‌ونقل عمومی و فقط برای مسیرهایی برگردانده می‌شود که اطلاعات کرایه برای همه بخش‌های حمل‌ونقل عمومی دردسترس باشد. این اطلاعات شامل موارد زیر است:
    • currency: کد ارز ISO 4217 که نشان‌دهنده ارزی است که مبلغ به آن بیان شده است.
    • value: مبلغ کل کرایه، به واحد پولی که در بالا مشخص شده است.

بخش‌های مسیر

توجه: نام شیء قدیمی DirectionsRoute به DirectionsLeg تغییر کرده است.

DirectionsLeg یک بخش از سفر را از مبدأ تا مقصد در مسیر محاسبه‌شده تعریف می‌کند. برای مسیرهایی که هیچ نقطه‌مسیری ندارند، مسیر شامل یک «بخش» خواهد بود، اما برای مسیرهایی که یک یا چند نقطه‌مسیر را تعریف می‌کنند، مسیر شامل یک یا چند بخش خواهد بود که با بخش‌های خاص سفر مطابقت دارد.

‫DirectionsLeg یک راستین‌نماد شیء با فیلدهای زیر است:

  • steps[] حاوی آرایه‌ای از اشیاء DirectionsStep است که اطلاعات مربوط به هر مرحله جداگانه از بخش سفر را نشان می‌دهد.

  • distance نشان‌دهنده کل مسافت طی‌شده توسط این بخش است، به‌عنوان یک شیء Distance از فرم زیر:

    • value نشان‌دهنده فاصله به متر است
    • text حاوی نمایش رشته‌ای مسافت است که به‌طور پیش‌فرض در واحدهایی که در مبدأ استفاده می‌شود نمایش داده می‌شود. (برای مثال، برای هر مبدأ در ایالات متحده از مایل استفاده خواهد شد.) می‌توانید این سیستم واحد را با تنظیم کردن مشخص UnitSystem در پُرسمان اصلی لغو کنید. توجه داشته باشید که صرف‌نظر از اینکه از چه سیستم واحدی استفاده می‌کنید، فیلد distance.value همیشه حاوی مقداری است که به متر بیان می‌شود.

    اگر فاصله نامشخص باشد، ممکن است این فیلدها تعریف‌نشده باشند.

  • duration نشان‌دهنده مدت کل این بخش است، به‌عنوان شیء Duration با فرم زیر:

    • value نشان‌دهنده مدت زمان به ثانیه است.
    • text حاوی نمایش رشته‌ای مدت زمان است.

    اگر مدت نامشخص باشد، ممکن است این فیلدها تعریف‌نشده باشند.

  • duration_in_traffic نشان‌دهنده مدت کل این بخش است که شرایط ترافیک فعلی را درنظر می‌گیرد. duration_in_traffic فقط درصورتی برگردانده می‌شود که همه موارد زیر درست باشد:

    • درخواست شامل نقطه‌مسیرهای توقف بین راه نیست. یعنی شامل نقاط‌مسیرهایی که stopover در آن‌ها true است نمی‌شود.
    • درخواست به‌طور خاص برای مسیرهای رانندگی است— mode روی driving تنظیم شده است.
    • ‫departureTime به‌عنوان بخشی از فیلد drivingOptions در درخواست گنجانده شده است.
    • شرایط ترافیک برای مسیر درخواستی دردسترس است.

    duration_in_traffic شامل فیلدهای زیر است:

    • value نشان‌دهنده مدت زمان به ثانیه است.
    • text حاوی نمایشی قابل‌خواندن برای انسان از مدت است.
  • arrival_time حاوی زمان برآوردی ورود برای این بخش است. این ویژگی فقط برای مسیرهای حمل‌ونقل عمومی برگردانده می‌شود. نتیجه به‌صورت شیء Time با سه ویژگی برگردانده می‌شود:
    • value زمان مشخص‌شده به‌عنوان شیء Date جاوا اسکریپت.
    • text زمان مشخص‌شده به‌عنوان رشته. زمان در منطقه زمانی ایستگاه حمل‌ونقل عمومی نمایش داده می‌شود.
    • time_zone حاوی منطقه زمانی این ایستگاه است. مقدار نام منطقه زمانی است که در پایگاه داده منطقه زمانی IANA تعریف شده است، مثلاً «America/New_York».
  • departure_time حاوی زمان تخمینی حرکت برای این بخش است که به‌عنوان شیء Time مشخص شده است. departure_time فقط برای مسیرهای حمل‌ونقل عمومی دردسترس است.
  • start_location حاوی LatLng مبدأ این بخش است. چون «سرویس وب مسیرها» مسیرهای بین مکان‌ها را بااستفاده از نزدیک‌ترین گزینه حمل‌ونقل (معمولاً جاده) در نقطه شروع و پایان محاسبه می‌کند، start_location ممکن است با مبدأ ارائه‌شده برای این بخش متفاوت باشد، مثلاً اگر جاده‌ای نزدیک مبدأ نباشد.
  • end_location حاوی LatLng مقصد این بخش است. چون DirectionsService مسیرهای بین مکان‌ها را بااستفاده از نزدیک‌ترین گزینه حمل‌ونقل (معمولاً جاده) در نقطه شروع و پایان محاسبه می‌کند، end_location ممکن است با مقصد ارائه‌شده برای این بخش متفاوت باشد، مثلاً اگر جاده‌ای نزدیک مقصد نباشد.
  • start_address حاوی نشانی قابل‌خواندن برای انسان (معمولاً نشانی خیابان) برای شروع این بخش است.

    این محتوا باید همان‌طور که هست خوانده شود. نشانی قالب‌بندی‌شده را به‌صورت برنامه‌نویسی تجزیه نکنید.
  • end_address حاوی نشانی قابل‌خواندن برای انسان (معمولاً نشانی خیابان) در انتهای این بخش است.

    این محتوا باید همان‌طور که هست خوانده شود. نشانی قالب‌بندی‌شده را به‌صورت برنامه‌نویسی تجزیه نکنید.

مراحل مسیر

DirectionsStep اتمی‌ترین واحد مسیر جهت‌یابی است که شامل یک مرحله است که دستورالعمل خاص و واحدی را در سفر شرح می‌دهد. مثلاً «در خیابان غربی به چپ بپیچید. ‫4th St.‎» این مرحله نه‌تنها دستورالعمل را شرح می‌دهد، بلکه حاوی اطلاعات مسافت و مدت‌زمان مربوط به نحوه ارتباط این مرحله با مرحله بعدی است. برای مثال، مرحله‌ای که با عنوان «ادغام در I-80 West» مشخص شده است ممکن است حاوی مدت «۳۷ مایل» و «۴۰ دقیقه» باشد، که نشان می‌دهد مرحله بعدی ۳۷ مایل/۴۰ دقیقه از این مرحله فاصله دارد.

هنگام استفاده از سرویس «مسیرها» برای جستجوی مسیرهای حمل‌ونقل عمومی، آرایه مراحل شامل اطلاعات خاص حمل‌ونقل عمومی اضافی به‌شکل شیء transit خواهد بود. اگر مسیرها شامل چندین حالت حمل‌ونقل باشد، مسیرهای دقیق برای مراحل پیاده‌روی یا رانندگی در آرایه steps[] ارائه خواهد شد. برای مثال، مرحله پیاده‌روی شامل مسیرهای از مکان شروع و پایان خواهد بود: «پیاده‌روی به Innes Ave & Fitch St». آن مرحله شامل مسیرهای پیاده‌روی دقیق برای آن مسیر در آرایه steps[] خواهد بود، مانند: «به‌سمت شمال غربی بروید»، «به‌سمت چپ در خیابان آریلیوس واکر بپیچید»، و «به‌سمت چپ در خیابان اینس بپیچید».

‫DirectionsStep یک راستین‌نماد شیء با فیلدهای زیر است:

  • instructions حاوی دستورالعمل‌هایی برای این مرحله در رشته نوشتاری است.
  • distance حاوی مسافت طی‌شده در این مرحله تا مرحله بعدی است، به‌عنوان شیء Distance. (شرح را در DirectionsLeg بالا ببینید.) اگر فاصله نامشخص باشد، ممکن است این فیلد تعریف‌نشده باشد.
  • duration حاوی تخمینی از زمان موردنیاز برای انجام مرحله، تا مرحله بعدی، به‌عنوان شیء Duration است. (شرح را در DirectionsLeg بالا ببینید.) اگر مدت نامشخص باشد، ممکن است این فیلد تعریف‌نشده باشد.
  • start_location حاوی زمین‌کدیاب LatLng نقطه شروع این مرحله است.
  • end_location حاوی LatLng نقطه پایانی این مرحله است.
  • polyline حاوی یک شیء points است که نمایش چندخطی کدبندی‌شده مرحله را نگه می‌دارد. این چندخطی مسیر تقریبی (هموارشده) مرحله است.
  • steps[] راستین‌نماد شیء DirectionsStep که حاوی مسیرهای دقیق برای مراحل پیاده‌روی یا رانندگی در مسیرهای حمل‌ونقل عمومی است. زیرمراحل فقط برای مسیرهای حمل‌ونقل عمومی دردسترس است.
  • travel_mode حاوی TravelMode استفاده‌شده در این مرحله است. مسیرهای حمل‌ونقل عمومی ممکن است ترکیبی از مسیرهای پیاده‌روی و حمل‌ونقل عمومی باشد.
  • path حاوی آرایه‌ای از LatLngs است که مسیر این مرحله را توصیف می‌کند.
  • transit حاوی اطلاعات خاص حمل‌ونقل عمومی است، مثل زمان ورود و خروج، و نام خط حمل‌ونقل عمومی.

اطلاعات خاص حمل‌ونقل عمومی

مسیرهای حمل‌ونقل عمومی اطلاعات بیشتری را برمی‌گرداند که برای سایر حالت‌های حمل‌ونقل مربوط نیست. این ویژگی‌های اضافی ازطریق شیء TransitDetails نمایش داده می‌شوند و به‌عنوان ویژگی DirectionsStep برگردانده می‌شوند. از شیء TransitDetails می‌توانید به اطلاعات بیشتری برای اشیاء TransitStop، TransitLine، TransitAgency، و VehicleType دسترسی پیدا کنید که در زیر شرح داده شده است.

جزئیات حمل‌ونقل عمومی

شیء TransitDetails ویژگی‌های زیر را نمایان می‌کند:

  • arrival_stop حاوی یک شیء TransitStop است که ایستگاه/ توقفگاه ورود را با ویژگی‌های زیر نشان می‌دهد:
    • name نام ایستگاه/ توقفگاه حمل‌ونقل عمومی. مثلاً «Union Square».
    • location مکان ایستگاه/ توقفگاه حمل‌ونقل عمومی، که با LatLng نشان داده می‌شود.
  • departure_stop حاوی شیء TransitStop است که نشان‌دهنده ایستگاه/ توقفگاه عزیمت است.
  • arrival_time حاوی زمان ورود است که به‌عنوان یک شیء Time با سه ویژگی مشخص شده است:
    • value زمان مشخص‌شده به‌عنوان شیء Date جاوا اسکریپت.
    • text زمان مشخص‌شده به‌عنوان رشته. زمان در منطقه زمانی ایستگاه حمل‌ونقل عمومی نمایش داده می‌شود.
    • time_zone حاوی منطقه زمانی این ایستگاه است. مقدار نام منطقه زمانی است که در پایگاه داده منطقه زمانی IANA تعریف شده است، مثلاً «America/New_York».
  • departure_time حاوی زمان حرکت است که به‌صورت شیء Time مشخص شده است.
  • headsign جهتی را که باید در این خط طی شود مشخص می‌کند، همان‌طور که روی وسیله نقلیه یا در ایستگاه عزیمت علامت‌گذاری شده است. این ایستگاه اغلب ایستگاه پایانی خواهد بود.
  • headway درصورت دردسترس بودن، این مقدار تعداد ثانیه‌های موردانتظار بین حرکت‌ها از یک ایستگاه را در این زمان مشخص می‌کند. برای مثال، با مقدار headway ۶۰۰، اگر به اتوبوس نرسید، انتظار می‌رود ده دقیقه منتظر بمانید.
  • line حاوی یک راستین‌نماد شیء TransitLine است که اطلاعاتی درباره خط حمل‌ونقل عمومی استفاده‌شده در این مرحله دارد. TransitLine نام و اپراتور خط را به‌همراه سایر ویژگی‌های شرح‌داده‌شده در سند مرجع TransitLine ارائه می‌دهد.
  • num_stops حاوی تعداد توقف‌ها در این مرحله است. شامل ایستگاه مقصد می‌شود، اما شامل ایستگاه مبدأ نمی‌شود. برای مثال، اگر مسیرهایتان شامل حرکت از ایستگاه الف، عبور از ایستگاه‌های ب و پ، و رسیدن به ایستگاه ت باشد، num_stops عدد ۳ را برمی‌گرداند.

خط ترانزیت

شیء TransitLine ویژگی‌های زیر را نشان می‌دهد:

  • name حاوی نام کامل این خط حمل‌ونقل عمومی است. برای نمونه: «7 Avenue Express» یا «14th St Crosstown».
  • short_name حاوی نام کوتاه این خط حمل‌ونقل عمومی است. این معمولاً شماره خط است، مثلاً «۲» یا «M14».
  • agencies آرایه‌ای است که حاوی یک شیء TransitAgency است. شیء TransitAgency اطلاعاتی درباره اپراتور این خط ارائه می‌دهد، ازجمله ویژگی‌های زیر:
    • name حاوی نام سازمان حمل‌ونقل عمومی است.
    • phone حاوی شماره تلفن سازمان حمل‌ونقل عمومی است.
    • url حاوی نشانی وب سازمان حمل‌ونقل عمومی است.

    توجه: اگر به‌جای استفاده از شیء DirectionsRenderer، مسیرهای حمل‌ونقل عمومی را به‌صورت دستی ارائه می‌دهید، باید نام‌ها و نشانی‌های وب سازمان‌های حمل‌ونقل عمومی ارائه‌دهنده نتایج سفر را نمایش دهید.

  • url حاوی نشانی وب این خط حمل‌ونقل عمومی است که توسط سازمان حمل‌ونقل عمومی ارائه شده است.
  • icon حاوی نشانی وب برای نماد مرتبط با این خط است. اکثر شهرها از نمادهای عمومی استفاده می‌کنند که براساس نوع وسیله نقلیه متفاوت است. برخی‌از خطوط حمل‌ونقل عمومی، مانند سیستم مترو نیویورک، نمادهای مخصوص به آن خط را دارند.
  • color حاوی رنگی است که معمولاً در تابلوهای این حمل‌ونقل عمومی استفاده می‌شود. رنگ به‌صورت رشته‌ای در مبنای شانزده مشخص می‌شود، مانند: #FF0033.
  • text_color حاوی رنگ نوشتاری است که معمولاً برای تابلوهای این خط استفاده می‌شود. رنگ به‌صورت رشته‌ای در مبنای شانزده مشخص خواهد شد.
  • vehicle حاوی شیء Vehicle است که شامل ویژگی‌های زیر است:
    • ‫name حاوی نام خودرو در این خط است. مثلاً «Subway.»
    • type حاوی نوع وسیله نقلیه استفاده‌شده در این خط است. برای مشاهده فهرست کامل مقادیر پشتیبانی‌شده، به سند نوع خودرو مراجعه کنید.
    • icon حاوی نشانی وب برای نمادی است که معمولاً با این نوع خودرو مرتبط است.
    • local_icon حاوی نشانی وب نماد مرتبط با این نوع وسیله نقلیه براساس تابلوهای حمل‌ونقل محلی است.

نوع خودرو

شیء VehicleType ویژگی‌های زیر را نشان می‌دهد:

مقدار تعریف
VehicleType.RAIL راه‌آهن.
VehicleType.METRO_RAIL قطار شهری.
VehicleType.SUBWAY قطار شهری زیرزمینی.
VehicleType.TRAM قطار شهری روی زمین.
VehicleType.MONORAIL مونوریل.
VehicleType.HEAVY_RAIL ریلی سنگین.
VehicleType.COMMUTER_TRAIN قطار حومه‌ای.
VehicleType.HIGH_SPEED_TRAIN قطار پرسرعت.
VehicleType.BUS اتوبوس.
VehicleType.INTERCITY_BUS اتوبوس بین‌شهری.
VehicleType.TROLLEYBUS اتوبوس برقی.
VehicleType.SHARE_TAXI تاکسی اشتراکی نوعی اتوبوس است که می‌تواند مسافران را در هر جایی از مسیرش سوار یا پیاده کند.
VehicleType.FERRY کشتی.
VehicleType.CABLE_CAR وسیله نقلیه‌ای که با کابل کار می‌کند، معمولاً روی زمین. تله‌کابین‌ها ممکن است از نوع VehicleType.GONDOLA_LIFT باشند.
VehicleType.GONDOLA_LIFT تله‌کابین هوایی.
VehicleType.FUNICULAR وسیله نقلیه‌ای که با کابل از شیب تندی بالا کشیده می‌شود. قطار کابلی معمولاً از دو واگن تشکیل شده است که هر واگن به‌عنوان وزنه تعادل برای واگن دیگر عمل می‌کند.
VehicleType.OTHER همه وسایل نقلیه دیگر این نوع را برمی‌گردانند.

درحال بازرسی DirectionsResults

مؤلفه‌های DirectionsResults — DirectionsRoute، DirectionsLeg، DirectionsStep و TransitDetails — ممکن است هنگام تجزیه هر پاسخ مسیرها بازرسی و استفاده شوند.

مهم: اگر مسیرهای حمل‌ونقل عمومی را به‌جای استفاده از شیء DirectionsRenderer به‌صورت دستی ارائه می‌دهید، باید نام‌ها و نشانی‌های وب آژانس‌های حمل‌ونقل عمومی که نتایج سفر را ارائه می‌دهند نمایش دهید.

مثال زیر مسیرهای پیاده‌روی را به برخی جاذبه‌های گردشگری در شهر نیویورک ترسیم می‌کند. ما DirectionsStep مسیر را بررسی می‌کنیم تا برای هر مرحله نشانگر اضافه کنیم و اطلاعات را با نوشتار آموزشی برای آن مرحله به InfoWindow پیوست کنیم.

توجه: ازآنجایی‌که مسیرهای پیاده‌روی را محاسبه می‌کنیم، هرگونه هشدار را نیز در پانل <div> جداگانه‌ای به کاربر نمایش می‌دهیم.

var map;
var directionsRenderer;
var directionsService;
var stepDisplay;
var markerArray = [];

function initMap() {
  // Instantiate a directions service.
  directionsService = new google.maps.DirectionsService();

  // Create a map and center it on Manhattan.
  var manhattan = new google.maps.LatLng(40.7711329, -73.9741874);
  var mapOptions = {
    zoom: 13,
    center: manhattan
  }
  map = new google.maps.Map(document.getElementById('map'), mapOptions);

  // Create a renderer for directions and bind it to the map.
  var rendererOptions = {
    map: map
  }
  directionsRenderer = new google.maps.DirectionsRenderer(rendererOptions)

  // Instantiate an info window to hold step text.
  stepDisplay = new google.maps.InfoWindow();
}

function calcRoute() {

  // First, clear out any existing markerArray
  // from previous calculations.
  for (i = 0; i < markerArray.length; i++) {
    markerArray[i].setMap(null);
  }

  // Retrieve the start and end locations and create
  // a DirectionsRequest using WALKING directions.
  var start = document.getElementById('start').value;
  var end = document.getElementById('end').value;
  var request = {
      origin: start,
      destination: end,
      travelMode: 'WALKING'
  };

  // Route the directions and pass the response to a
  // function to create markers for each step.
  directionsService.route(request, function(response, status) {
    if (status == "OK") {
      var warnings = document.getElementById("warnings_panel");
      warnings.innerHTML = "" + response.routes[0].warnings + "";
      directionsRenderer.setDirections(response);
      showSteps(response);
    }
  });
}

function showSteps(directionResult) {
  // For each step, place a marker, and add the text to the marker's
  // info window. Also attach the marker to an array so we
  // can keep track of it and remove it when calculating new
  // routes.
  var myRoute = directionResult.routes[0].legs[0];

  for (var i = 0; i < myRoute.steps.length; i++) {
      var marker = new google.maps.Marker({
        position: myRoute.steps[i].start_point,
        map: map
      });
      attachInstructionText(marker, myRoute.steps[i].instructions);
      markerArray[i] = marker;
  }
}

function attachInstructionText(marker, text) {
  google.maps.event.addListener(marker, 'click', function() {
    stepDisplay.setContent(text);
    stepDisplay.open(map, marker);
  });
}

در بدنه HTML:

<div>
<strong>Start: </strong>
<select id="start">
  <option value="penn station, new york, ny">Penn Station</option>
  <option value="grand central station, new york, ny">Grand Central Station</option>
  <option value="625 8th Avenue New York NY 10018">Port Authority Bus Terminal</option>
  <option value="staten island ferry terminal, new york, ny">Staten Island Ferry Terminal</option>
  <option value="101 E 125th Street, New York, NY">Harlem - 125th St Station</option>
</select>
<strong>End: </strong>
<select id="end" onchange="calcRoute();">
  <option value="260 Broadway New York NY 10007">City Hall</option>
  <option value="W 49th St & 5th Ave, New York, NY 10020">Rockefeller Center</option>
  <option value="moma, New York, NY">MOMA</option>
  <option value="350 5th Ave, New York, NY, 10118">Empire State Building</option>
  <option value="253 West 125th Street, New York, NY">Apollo Theatre</option>
  <option value="1 Wall St, New York, NY">Wall St</option>
</select>
<div>

مشاهده نمونه

استفاده از نقاط مسیر در «مسیرها»

همان‌طور که در DirectionsRequest ذکر شده است، هنگام محاسبه مسیرها بااستفاده از سرویس «مسیرها» برای مسیرهای پیاده‌روی، دوچرخه‌سواری، یا رانندگی، می‌توانید نقاط‌مسیر (از نوع DirectionsWaypoint) را نیز مشخص کنید. نقطه‌مسیرها برای مسیرهای حمل‌ونقل عمومی دردسترس نیستند. نقاط‌مسیر به شما امکان می‌دهند مسیرها را ازطریق مکان‌های اضافی محاسبه کنید، در این صورت مسیر برگردانده‌شده از نقاط‌مسیر داده‌شده عبور می‌کند.

waypoint شامل فیلدهای زیر است:

  • location (الزامی) نشانی نقطه‌مسیر را مشخص می‌کند.
  • stopover (اختیاری) نشان می‌دهد که آیا این نقطه‌مسیر توقف واقعی در مسیر است (true) یا فقط اولویتی برای مسیریابی ازطریق مکان نشان‌داده‌شده است (false). توقف‌های بین‌راهی به‌طور پیش‌فرض true هستند.

به‌طور پیش‌فرض، سرویس «مسیرها» مسیری را ازطریق نقطه‌مسیرهای ارائه‌شده به‌ترتیب داده‌شده محاسبه می‌کند. درصورت تمایل، می‌توانید optimizeWaypoints: true را در DirectionsRequest ارسال کنید تا به سرویس «مسیرها» اجازه دهید با مرتب کردن مجدد نقاط‌مسیر به ترتیبی کارآمدتر، مسیر ارائه‌شده را بهینه‌سازی کند. (این بهینه‌سازی کاربردی از مسئله فروشنده دوره‌گرد است.) مدت سفر عامل اصلی است که بهینه‌سازی می‌شود، اما عوامل دیگری مثل مسافت، تعداد پیچ‌ها، و موارد بسیار دیگری ممکن است هنگام تصمیم‌گیری درباره اینکه کدام مسیر کارآمدترین است درنظر گرفته شود. برای اینکه سرویس «مسیرها» بتواند مسیر را بهینه‌سازی کند، همه نقاط‌مسیر باید توقفگاه باشند.

اگر به سرویس «مسیرها» دستور دهید ترتیب نقاط‌مسیر را بهینه‌سازی کند، ترتیب آن‌ها در فیلد waypoint_order در شیء DirectionsResult برگردانده خواهد شد.

مثال زیر مسیرهای بین‌کشوری را در سراسر ایالات متحده بااستفاده از انواع نقاط شروع، نقاط پایان، و نقطه‌مسیرها محاسبه می‌کند. (برای انتخاب چند نقطه‌مسیر، هنگام انتخاب موارد در فهرست، Ctrl-کلیک را فشار دهید.) توجه داشته باشید که ما routes.start_address و routes.end_address را بررسی می‌کنیم تا نوشتار مربوط به نقطه شروع و پایان هر مسیر را به ما ارائه دهد.

TypeScript

function initMap(): void {
  const directionsService = new google.maps.DirectionsService();
  const directionsRenderer = new google.maps.DirectionsRenderer();
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 6,
      center: { lat: 41.85, lng: -87.65 },
    }
  );

  directionsRenderer.setMap(map);

  (document.getElementById("submit") as HTMLElement).addEventListener(
    "click",
    () => {
      calculateAndDisplayRoute(directionsService, directionsRenderer);
    }
  );
}

function calculateAndDisplayRoute(
  directionsService: google.maps.DirectionsService,
  directionsRenderer: google.maps.DirectionsRenderer
) {
  const waypts: google.maps.DirectionsWaypoint[] = [];
  const checkboxArray = document.getElementById(
    "waypoints"
  ) as HTMLSelectElement;

  for (let i = 0; i < checkboxArray.length; i++) {
    if (checkboxArray.options[i].selected) {
      waypts.push({
        location: (checkboxArray[i] as HTMLOptionElement).value,
        stopover: true,
      });
    }
  }

  directionsService
    .route({
      origin: (document.getElementById("start") as HTMLInputElement).value,
      destination: (document.getElementById("end") as HTMLInputElement).value,
      waypoints: waypts,
      optimizeWaypoints: true,
      travelMode: google.maps.TravelMode.DRIVING,
    })
    .then((response) => {
      directionsRenderer.setDirections(response);

      const route = response.routes[0];
      const summaryPanel = document.getElementById(
        "directions-panel"
      ) as HTMLElement;

      summaryPanel.innerHTML = "";

      // For each route, display summary information.
      for (let i = 0; i < route.legs.length; i++) {
        const routeSegment = i + 1;

        summaryPanel.innerHTML +=
          "<b>Route Segment: " + routeSegment + "</b><br>";
        summaryPanel.innerHTML += route.legs[i].start_address + " to ";
        summaryPanel.innerHTML += route.legs[i].end_address + "<br>";
        summaryPanel.innerHTML += route.legs[i].distance!.text + "<br><br>";
      }
    })
    .catch((e) => window.alert("Directions request failed due to " + status));
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;

JavaScript

function initMap() {
  const directionsService = new google.maps.DirectionsService();
  const directionsRenderer = new google.maps.DirectionsRenderer();
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 6,
    center: { lat: 41.85, lng: -87.65 },
  });

  directionsRenderer.setMap(map);
  document.getElementById("submit").addEventListener("click", () => {
    calculateAndDisplayRoute(directionsService, directionsRenderer);
  });
}

function calculateAndDisplayRoute(directionsService, directionsRenderer) {
  const waypts = [];
  const checkboxArray = document.getElementById("waypoints");

  for (let i = 0; i < checkboxArray.length; i++) {
    if (checkboxArray.options[i].selected) {
      waypts.push({
        location: checkboxArray[i].value,
        stopover: true,
      });
    }
  }

  directionsService
    .route({
      origin: document.getElementById("start").value,
      destination: document.getElementById("end").value,
      waypoints: waypts,
      optimizeWaypoints: true,
      travelMode: google.maps.TravelMode.DRIVING,
    })
    .then((response) => {
      directionsRenderer.setDirections(response);

      const route = response.routes[0];
      const summaryPanel = document.getElementById("directions-panel");

      summaryPanel.innerHTML = "";

      // For each route, display summary information.
      for (let i = 0; i < route.legs.length; i++) {
        const routeSegment = i + 1;

        summaryPanel.innerHTML +=
          "<b>Route Segment: " + routeSegment + "</b><br>";
        summaryPanel.innerHTML += route.legs[i].start_address + " to ";
        summaryPanel.innerHTML += route.legs[i].end_address + "<br>";
        summaryPanel.innerHTML += route.legs[i].distance.text + "<br><br>";
      }
    })
    .catch((e) => window.alert("Directions request failed due to " + status));
}

window.initMap = initMap;

محدودیت‌ها و موانع برای نقاط‌مسیر

محدودیت‌های استفاده و محدودیت‌های زیر اعمال می‌شود:

  • حداکثر تعداد نقاط‌مسیر مجاز هنگام استفاده از سرویس «مسیرها» در Maps JavaScript API‏ ۲۵ است، به‌علاوه مبدأ و مقصد. محدودیت‌ها برای سرویس وب Directions API (Legacy) یکسان است.
  • برای سرویس وب Directions API (قدیمی)، مشتریان مجاز به استفاده از ۲۵ نقطه‌مسیر، به‌علاوه مبدأ و مقصد هستند.
  • مشتریان «طرح Google Maps Platform Premium» مجاز به استفاده از ۲۵ نقطه‌مسیر، به‌علاوه مبدأ و مقصد هستند.
  • از نقاط‌مسیر برای مسیرهای حمل‌ونقل عمومی پشتیبانی نمی‌شود.

مسیرهای کشیدنی

کاربران می‌توانند مسیرهای دوچرخه‌سواری، پیاده‌روی، یا رانندگی نمایش‌داده‌شده را بااستفاده از DirectionsRenderer به‌صورت پویا تغییر دهند، اگر کشیدنی باشند، به کاربر اجازه می‌دهد با کلیک کردن و کشیدن مسیرهای حاصل روی نقشه، مسیرها را انتخاب و تغییر دهد. با تنظیم کردن ویژگی draggable روی true، مشخص می‌کنید که آیا نمایشگر پردازنده اجازه می‌دهد مسیرهای قابل‌کشیدن نمایش داده شود یا نه. مسیرهای حمل‌ونقل عمومی را نمی‌توان کشیدنی کرد.

وقتی مسیرها کشیدنی باشند، کاربر می‌تواند هر نقطه‌ای را در مسیر (یا نقطه‌مسیر) نتیجه ارائه‌شده انتخاب کند و مؤلفه نشان‌داده‌شده را به مکان جدیدی منتقل کند. DirectionsRenderer به‌طور پویا به‌روز می‌شود تا مسیر اصلاح‌شده را نشان دهد. پس‌از رها کردن، نقطه‌مسیر انتقالی به نقشه اضافه می‌شود (با نشانگر سفید کوچکی نشان داده می‌شود). انتخاب و جابه‌جایی بخش مسیر، آن قسمت از مسیر را تغییر می‌دهد، درحالی‌که انتخاب و جابه‌جایی نشانگر نقطه‌مسیر (ازجمله نقاط شروع و پایان)، قسمت‌های مسیر عبوری از آن نقطه‌مسیر را تغییر می‌دهد.

چون مسیرهای کشیدنی در سمت کارخواه اصلاح و ارائه می‌شوند، ممکن است بخواهید رویداد directions_changed را در DirectionsRenderer نظارت و مدیریت کنید تا وقتی کاربر مسیرهای نمایش‌داده‌شده را اصلاح کرد، مطلع شوید.

کد زیر سفری را از پرت در ساحل غربی استرالیا به سیدنی در ساحل شرقی نشان می‌دهد. کد رویداد directions_changed را نظارت می‌کند تا کل مسافت همه بخش‌های سفر را به‌روز کند.

TypeScript

function initMap(): void {
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 4,
      center: { lat: -24.345, lng: 134.46 }, // Australia.
    }
  );

  const directionsService = new google.maps.DirectionsService();
  const directionsRenderer = new google.maps.DirectionsRenderer({
    draggable: true,
    map,
    panel: document.getElementById("panel") as HTMLElement,
  });

  directionsRenderer.addListener("directions_changed", () => {
    const directions = directionsRenderer.getDirections();

    if (directions) {
      computeTotalDistance(directions);
    }
  });

  displayRoute(
    "Perth, WA",
    "Sydney, NSW",
    directionsService,
    directionsRenderer
  );
}

function displayRoute(
  origin: string,
  destination: string,
  service: google.maps.DirectionsService,
  display: google.maps.DirectionsRenderer
) {
  service
    .route({
      origin: origin,
      destination: destination,
      waypoints: [
        { location: "Adelaide, SA" },
        { location: "Broken Hill, NSW" },
      ],
      travelMode: google.maps.TravelMode.DRIVING,
      avoidTolls: true,
    })
    .then((result: google.maps.DirectionsResult) => {
      display.setDirections(result);
    })
    .catch((e) => {
      alert("Could not display directions due to: " + e);
    });
}

function computeTotalDistance(result: google.maps.DirectionsResult) {
  let total = 0;
  const myroute = result.routes[0];

  if (!myroute) {
    return;
  }

  for (let i = 0; i < myroute.legs.length; i++) {
    total += myroute.legs[i]!.distance!.value;
  }

  total = total / 1000;
  (document.getElementById("total") as HTMLElement).innerHTML = total + " km";
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;

JavaScript

function initMap() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 4,
    center: { lat: -24.345, lng: 134.46 }, // Australia.
  });
  const directionsService = new google.maps.DirectionsService();
  const directionsRenderer = new google.maps.DirectionsRenderer({
    draggable: true,
    map,
    panel: document.getElementById("panel"),
  });

  directionsRenderer.addListener("directions_changed", () => {
    const directions = directionsRenderer.getDirections();

    if (directions) {
      computeTotalDistance(directions);
    }
  });
  displayRoute(
    "Perth, WA",
    "Sydney, NSW",
    directionsService,
    directionsRenderer,
  );
}

function displayRoute(origin, destination, service, display) {
  service
    .route({
      origin: origin,
      destination: destination,
      waypoints: [
        { location: "Adelaide, SA" },
        { location: "Broken Hill, NSW" },
      ],
      travelMode: google.maps.TravelMode.DRIVING,
      avoidTolls: true,
    })
    .then((result) => {
      display.setDirections(result);
    })
    .catch((e) => {
      alert("Could not display directions due to: " + e);
    });
}

function computeTotalDistance(result) {
  let total = 0;
  const myroute = result.routes[0];

  if (!myroute) {
    return;
  }

  for (let i = 0; i < myroute.legs.length; i++) {
    total += myroute.legs[i].distance.value;
  }

  total = total / 1000;
  document.getElementById("total").innerHTML = total + " km";
}

window.initMap = initMap;
مشاهده نمونه