ناوبری بهبود یافته به فرودگاه ها، ناوبری بهبود یافته به فرودگاه ها

فرودگاه ها مجتمع های بزرگ و چند ترمینالی هستند و ناوبری دقیق برای ورود و خروج به موقع ضروری است. Google Maps Geocoding API معمولاً مختصاتی (طول/طول جغرافیایی) را برمی‌گرداند که در بیشتر موارد مرکز مجتمع فرودگاهی بزرگ است. این برنامه یک ابزار تعاملی است که به طور خاص طراحی شده است تا به کاربران کمک کند مکان‌های دقیق را در یک مکان پیچیده بزرگ‌تر مانند ترمینال‌های خاص یا نقاط تحویل / تحویل در فرودگاه شناسایی و تجسم کنند.

در اینجا نحوه دستیابی به این امر آورده شده است:

جستجوی فرودگاه/محل برگزاری : کاربران با جستجوی یک مکان اصلی (به عنوان مثال، "فرودگاه بین المللی ایندیرا گاندی") با استفاده از ورودی تکمیل خودکار Google Places، که محدود به هند است، شروع می کنند.

کشف مکان فرعی : هنگامی که یک مکان اصلی انتخاب شد، اسکریپت از Google Places API برای واکشی جزئیات استفاده می کند، که به طور مهمی شامل هر "مقصد فرعی" فهرست شده مرتبط با آن مکان است (مانند ترمینال 1، ترمینال 3، دروازه های خاص، و غیره، اگر در داده های Google موجود باشد).

Visual Mapping : این اسکریپت از API Geocoding برای یافتن مختصات مکان اصلی و مقاصد فرعی آن استفاده می کند.

سپس مکان اصلی را نشان می دهد و نشانگرهای قابل کلیک متمایز (دایره های آبی) را برای هر مقصد فرعی مشخص شده روی نقشه نشان می دهد.

شناسایی دقیق : با کلیک بر روی نشانگر مقصد فرعی آن را برجسته می‌کند (سبز می‌شود) و پنجره اطلاعاتی را باز می‌کند که نام و سایر جزئیات موجود (مانند آدرس یا نوع) را نشان می‌دهد و به کاربر اجازه می‌دهد تا تأیید کند که نقطه خاص را درست انتخاب کرده است. نمای متنی : نقشه به طور خودکار نمای خود را تنظیم می کند ( fitBounds ) تا تأیید کند که همه نشانگرهای مرتبط (موقعیت اصلی + مقصدهای فرعی) به وضوح قابل مشاهده هستند.

API های پلتفرم نقشه های گوگل در برنامه ناوبری فرودگاه

این سند، API های کلیدی پلتفرم نقشه های گوگل و پارامترهای آنها را که در برنامه نمایشی ارائه شده "Navigate to Airport" استفاده شده است، توضیح می دهد. این برنامه از چندین سرویس برای ارائه نمایش نقشه، جستجوی مکان، اطلاعات دقیق مکان، و بینش پیشرفته موقعیت مکانی استفاده می کند.

1. مقداردهی اولیه و نمایش نقشه

اساس برنامه خود نقشه تعاملی است.

• API مورد استفاده: google.maps.Map (از Maps JavaScript API)
• هدف: ایجاد و نمایش نقشه تعاملی در صفحه وب.
• پارامترهای کلیدی:
  • center : مرکز جغرافیایی اولیه نقشه را مشخص می کند. در این برنامه، ابتدا روی مختصات دهلی تنظیم شده است ( { lat: 28.461835685621395, lng: 77.05004035761647 } ).
  • zoom : سطح بزرگنمایی اولیه نقشه را تنظیم می کند. DEFAULT_ZOOM_LEVEL (15) برای نمای نزدیک استفاده می شود.
  • mapId : یک شناسه منحصر به فرد برای سبک نقشه پیکربندی شده در Google Cloud Console.

2. جستجوی مکان و تکمیل خودکار

عملکرد نوار جستجو توسط Places API ارائه می شود.

• API مورد استفاده: google.maps.places.Autocomplete (از کتابخانه مکان های Maps JavaScript API)
• هدف: تکمیل متن پیش‌بینی‌کننده را برای جستجوهای جغرافیایی به هنگام تایپ کاربر فراهم می‌کند و مکان‌های مرتبطی مانند فرودگاه‌ها را پیشنهاد می‌کند.
• پارامترهای کلیدی:
  • input : عنصر ورودی HTML ( #search-input ) که در آن کاربر درخواست خود را تایپ می کند.
  • componentRestrictions : نتایج جستجو را برای یک کشور خاص فیلتر می کند. در اینجا، { country: 'in' } نتایج را به هند محدود می کند.
  • fields : فیلدهای داده ای را که باید برای مکان انتخاب شده برگردانده شوند را مشخص می کند. ['place_id'] در ابتدا برای بازیابی تنها شناسه منحصر به فرد مکان، بهینه سازی انتقال داده استفاده می شود.
• نحوه استفاده از تکمیل خودکار

    // Initialize Autocomplete
    const autocomplete = new google.maps.places.Autocomplete(input, {
      componentRestrictions: { country: 'in' },
      fields: ['place_id'],
    });

    // Add listener to the Autocomplete
    autocomplete.addListener('place_changed', async () => {
      const place = autocomplete.getPlace();
      if (!place.place_id) {
        return;
      }
      // Once a place is selected, fetch details
      await getPlaceDetails(place.place_id);
    });

3. بازیابی اطلاعات مکان دقیق و رسیدگی به مقاصد فرعی

هنگامی که مکانی از میان پیشنهادات تکمیل خودکار انتخاب شد، جزئیات جامع تری واکشی می شوند.

• API مورد استفاده: Places API (از طریق تماس مستقیم fetch به https://places.googleapis.com/v1/places/{placeId} )
• هدف: بازیابی جزئیات غنی در مورد یک مکان خاص، از جمله نام نمایشی، آدرس، انواع، و مهمتر از همه، subDestinations آن (به عنوان مثال، پایانه های فردی یا مناطق مهم در یک مجموعه بزرگتر مانند فرودگاه).
• پارامترهای کلیدی در URL:
  1. {placeId} : شناسه منحصر به فرد مکان انتخاب شده.
  2. fields : فیلدهای دقیق داده را برای بازیابی مشخص می کند. این برنامه id ، displayName ، subDestinations ، types و formattedAddress درخواست می‌کند. این برای کنترل هزینه ها و دریافت تنها داده های ضروری بسیار مهم است.
• نحوه دریافت موقعیت مکانی به subDestinations

async function getPlaceDetails(placeId) {
  // Construct the URL for the Places API (v1) details endpoint
  // The 'fields' parameter is crucial for requesting subDestinations
  const url = `https://places.googleapis.com/v1/places/${placeId}?key=YOUR_API_KEY&fields=id,displayName,subDestinations,types,formattedAddress`;

  const response = await fetch(url);
  const data = await response.json();

  // Accessing subDestinations from the Places API response
  if (data.subDestinations && data.subDestinations.length > 0) {
    for (const subDestination of data.subDestinations) {
      // Each subDestination object contains an 'id' and 'displayName'
      console.log(`Sub-destination ID: ${subDestination.id}`);
      console.log(`Sub-destination Name: ${subDestination.displayName?.text}`);
      // This subDestination.id is then used in a geocoding call (as shown in section 4)
    }
  }
}

**Handling `subDestinations`:** When the Places API returns
`subDestinations`, the application initiates a process for each one:
1.  **Geocoding:** It uses the `google.maps.Geocoder` to convert
    each `subDestination.id` into its precise geographical coordinates
    (`lat`, `lng`).
1.  **Marker Placement:** A distinct marker is added to the map for
    each sub-destination. These markers are styled with a blue circle icon
    to differentiate them.
1.  **Map Bounds Adjustment:** The `google.maps.LatLngBounds` object
    is used to dynamically expand the map's view to encompass all retrieved
    sub-destinations, verifying they are all visible within the current map
    frame.
1.  **Interactive Information Window:** A `click` listener is
    attached to each sub-destination marker. When clicked, the marker's
    icon changes to green, and an `InfoWindow` appears, displaying the
    sub-destination's name, address, and types. This provides immediate,
    detailed context to the user.

4. Geocoding و Reverse Geocoding: واکشی جزئیات برای مقاصد فرعی

این برنامه از geocoding برای دو هدف اصلی استفاده می کند: تبدیل شناسه مکان به مختصات و تبدیل مختصات به جزئیات مکان. این بخش به طور خاص نحوه استفاده از geocoding برای دریافت اطلاعات دقیق در مورد مقصدهای فرعی را نشان می دهد.

• API مورد استفاده: google.maps.Geocoder (از Maps JavaScript API) و Geocoding API (از طریق تماس مستقیم fetch به https://maps.googleapis.com/maps/api/geocode/json )
• هدف:
  • google.maps.Geocoder : برای تبدیل یک placeId (به دست آمده از تکمیل خودکار یا Places API) به مختصات جغرافیایی ( lat , lng ) و یک viewport استفاده می شود که به نقشه امکان می دهد به درستی در مرکز و بزرگنمایی مکان انتخاب شده و مقاصد فرعی آن قرار گیرد.
  • Geocoding API ( fetch ): برای ژئوکدینگ معکوس (تبدیل طول و عرض جغرافیایی به آدرس قابل خواندن برای انسان) و برای بازیابی اطلاعات موقعیت مکانی پیشرفته مانند خطوط کلی ساختمان و نقاط ناوبری استفاده می شود.
• پارامترهای کلیدی:
  • google.maps.Geocoder.geocode() :
    • placeId : شناسه مکان برای geocode.
    • location : شی LatLng برای geocoding معکوس.
  • تماس fetch API Geocoding:
    • latlng : مختصات طول و عرض جغرافیایی برای کدگذاری معکوس جغرافیایی.
    • extra_computations=BUILDING_AND_ENTRANCES : این پارامتر حیاتی داده‌های اضافی را درخواست می‌کند، به‌ویژه ردپای ساختمان و اطلاعات ورودی، که سپس برای نمایش خطوط کلی ساختمان و نقاط ناوبری استفاده می‌شود.

نحوه استفاده از شناسه subDestination برای واکشی جزئیات بیشتر (به عنوان مثال، مکان، آدرس فرمت شده، انواع)

function geocodeAndAddMarker(subDestination, bounds) {
  return new Promise((resolve, reject) => {
    const geocoder = new google.maps.Geocoder();
    // Using the subDestination.id to geocode and get location details
    geocoder.geocode({ placeId: subDestination.id }, (results, status) => {
      if (status === "OK" && results[0]) {
        const location = results[0].geometry.location;
        const displayName = subDestination.displayName?.text || "Sub-destination";
        const formattedAddress = results[0].formatted_address; // Further detail from Geocoding
        const types = results[0].types; // Further detail from Geocoding

        const marker = new google.maps.Marker({
          map: map,
          position: location,
          title: displayName,
          icon: {
            path: google.maps.SymbolPath.CIRCLE,
            fillColor: 'blue',
            fillOpacity: 0.6,
            strokeWeight: 0,
            scale: 8
          }
        });

        marker.addListener('click', () => {
          marker.setIcon({
            path: google.maps.SymbolPath.CIRCLE,
            fillColor: 'green',
            fillOpacity: 0.6,
            strokeWeight: 0,
            scale: 8
          });
          const infowindow = new google.maps.InfoWindow({
            content: `<b>${displayName}</b><br><p>Address: ${formattedAddress}</p><p>Types: ${types.join(', ')}</p>`,
          });
          infowindow.open(map, marker);
        });
        bounds.extend(location);
        resolve(true);
      } else {
        reject(new Error(`Geocoding failed for placeId: ${subDestination.id}`));
      }
    });
  });
}

5. نمایش نشانگرها

نشانگرها برای برجسته کردن مکان های خاص روی نقشه استفاده می شوند.

• API مورد استفاده: google.maps.Marker (از Maps JavaScript API) و google.maps.marker.AdvancedMarkerElement با google.maps.marker.PinElement (از کتابخانه نشانگر Maps JavaScript API)
• هدف:
  • google.maps.Marker : برای نشانگر قابل کشیدن اولیه (اگرچه draggable در کد ارائه شده روی false تنظیم شده است، بخشی از قابلیت آن است) و برای نشانگرهای اصلی مقصد فرعی همانطور که در بخش 3 توضیح داده شد استفاده می شود.
  • AdvancedMarkerElement و PinElement : برای نشانگرهای نقطه ناوبری متمایزتر از نظر بصری استفاده می شود، که امکان استایل سفارشی پین نشانگر را فراهم می کند.
• پارامترهای کلیدی:
  • position : مختصات LatLng جایی که نشانگر قرار خواهد گرفت.
  • map : نمونه نقشه ای که نشانگر روی آن نمایش داده می شود.
  • title : متنی که هنگام نگه داشتن ماوس روی نشانگر نمایش داده می شود.
  • icon : به نمادهای سفارشی برای google.maps.Marker اجازه می دهد (به عنوان مثال، google.maps.SymbolPath.CIRCLE با رنگ های سفارشی).
  • content : برای AdvancedMarkerElement ، این امکان جاسازی محتوای سفارشی HTML، از جمله PinElement برای پین‌های از پیش استایل‌شده را می‌دهد.
  • پارامترهای PinElement : background ، borderColor ، glyphColor ، scale برای سفارشی سازی بصری.

6. نمایش خطوط کلی ساختمان

این برنامه می تواند به صورت بصری ردپای ساختمان ها را نشان دهد.

• API مورد استفاده: google.maps.Data (از Maps JavaScript API)
• هدف: نمایش داده های جغرافیایی، مانند خطوط کلی ساختمان (به عنوان GeoJSON display_polygon از extra_computations API Geocoding برگردانده شده است).
• پارامترهای کلیدی:
  • map : نمونه نقشه ای که لایه داده روی آن اعمال می شود.
  • style : ظاهر بصری ویژگی‌های GeoJSON را تعریف می‌کند (به عنوان مثال، strokeColor ، fillColor ، fillOpacity ).
  • addGeoJson() : روشی برای افزودن داده های GeoJSON به لایه.

7. محدوده نقشه و زوم

تأیید نمای نقشه همه مکان های مربوطه را در بر می گیرد.

• API مورد استفاده: google.maps.LatLngBounds (از Maps JavaScript API)
• هدف: تنظیم پویا نمای نقشه برای تناسب با مجموعه ای از نقاط جغرافیایی (مثلاً مکان اصلی و تمام مقاصد فرعی آن).
• روش های کلیدی:
  • extend(location) : یک نقطه LatLng به کران ها اضافه می کند و در صورت لزوم آنها را گسترش می دهد.
  • fitBounds(bounds) : مرکز نقشه و سطح زوم را برای نمایش کل ناحیه تعریف شده توسط شی LatLngBounds تنظیم می کند.

با ترکیب این APIهای پلتفرم Google Maps، این برنامه یک تجربه جامع و تعاملی برای جستجوی مکان‌ها، مشاهده جزئیات آن‌ها و تجسم اطلاعات جغرافیایی مرتبط مانند مقاصد فرعی و خطوط کلی ساختمان فراهم می‌کند.

ملاحظات پیاده سازی توجه داشته باشید که این در همه مناطق فرودگاه کار نمی کند و منوط به در دسترس بودن داده ها (ترمینال فرودگاه) است.

Resources Geocoding API Places API Maps Javascript API

نویسندگان: