เคล็ดลับในการสร้างประสบการณ์ของผู้ใช้ที่ดีที่สุดเมื่อไปยังสถานที่ต่างๆ ด้วยรถ

เอกสารนี้เป็นการปรับปรุงบทความเก่า ที่ใช้ GMP API เวอร์ชันก่อนหน้า เนื้อหานี้ได้รับการอัปเดตเป็น Places API เวอร์ชันใหม่ที่เปิดตัวในปี 2023-24 และ Routes API ที่เปิดตัวในปี 2023

โดยปกติแล้ว เมื่อผู้ใช้ขับรถไปยังจุดที่น่าสนใจ (POI) ผู้ใช้จะต้อง นำทางไปยังสถานที่ใกล้เคียง เช่น ลานจอดรถหรือ จุดเข้าถึง ลองนึกถึงคนขับที่ต้องไปสนามบินหรือห้างสรรพสินค้า เมื่อไปสนามบิน คนขับจะพยายามไปถึงอาคารผู้โดยสารหรือ จุดส่งผู้โดยสารแทนที่จะเป็นใจกลางของบริเวณสนามบิน ในทำนองเดียวกัน ที่จอดรถข้างศูนย์การค้าอาจเป็นตัวเลือกที่ดีกว่ามากสำหรับผู้ใช้ที่มีรถยนต์ ในกรณีนี้ เมื่อพัฒนาแอปหรือบริการเพื่อนำทางผู้ขับขี่ ให้ค้นหาตำแหน่งที่ผู้ขับขี่กำลังจะไปก่อน แล้วเสนอจุดหมายปลายทางเพิ่มเติมที่อยู่ใกล้ตำแหน่งนั้นให้ผู้ขับขี่ แนวทางนี้ช่วยให้คุณให้บริการลูกค้าได้ดียิ่งขึ้นและแสดงให้เห็นว่าคุณให้ความสำคัญกับเวลาของลูกค้า ด้วยความพยายามในการพัฒนาที่เล็กแต่ชาญฉลาดซึ่งใช้ประโยชน์จากข้อมูลตำแหน่งที่ Google Maps Platform ให้ไว้

แผนภาพระบบ

เราจะแสดงวิธีใช้ Places API ใหม่และ Routes API ตามลำดับหรือร่วมกันเพื่อระบุตำแหน่งที่เหมาะสมในการจอดรถใกล้กับจุดหมาย โซลูชันนี้มีจุดมุ่งหมายเพื่อขจัดความไม่แน่นอนและการโต้ตอบหลายครั้ง เพื่อค้นหาที่จอดรถขณะขับรถเมื่อใกล้ถึงจุดหมายปลายทาง ดูตัวอย่าง 2 กรณีเกี่ยวกับวิธีนำกรณีเหล่านี้ไปใช้โดยละเอียด

ตัวอย่างที่ 1 - สถานที่ท่องเที่ยวที่ไม่มีลานจอดรถ

เลือกสถานที่ที่ไม่ได้เชื่อมต่อกับริมถนนโดยตรงเพื่อให้ต้องดึงข้อมูลเส้นทางแยกต่างหาก โดยจุดหมายคือ Notre Dame ในปารีส และจุดเริ่มต้นคือสถานีรถไฟ Gare de l'Est (48.87697775149635, 2.3592247806755564)

Gare l'Est

คนขับออกจากสถานีที่อยู่ทางเหนือของน็อทร์-ดามประมาณ 16 นาที Notre Dame เป็นสถานที่ท่องเที่ยวที่มีชื่อเสียงบนเกาะซึ่งมีสะพานเชื่อมถึง มีถนนบางสายเป็นแบบ ทางเดียว และไม่มีที่จอดรถขนาดใหญ่ในบริเวณใกล้เคียง ดังนั้นการนำทางไปยังสถานที่นี้จึงเป็น ความท้าทายที่น่าสนใจ

1. คำขอ Places API

คำขอ Places API ตัวอย่างนี้ใช้การค้นหาข้อความเพื่อค้นหา Notre Dame ดูรายละเอียดได้ที่ เอกสารประกอบสำหรับนักพัฒนาซอฟต์แวร์ "$APIKEY" ในตัวอย่างเหล่านี้คือคีย์ API ที่คุณมีสำหรับ Google Maps Platform Places และ Routes API ที่เปิดใช้ใน Google Cloud Console ดูคำอธิบายโดยละเอียดเพิ่มเติมได้ในเอกสารประกอบสำหรับการเริ่มต้นใช้งาน Google Maps Platform

คำขอ Places API ใหม่มีรูปแบบใหม่ ฟิลด์การตอบกลับจะไม่ คงที่อีกต่อไป และในฐานะนักพัฒนาแอป คุณต้องกำหนดฟิลด์มาสก์ในส่วนหัว การใช้ fieldmask มีคำจำกัดความใน เอกสารประกอบ

curl -X POST --data @notre_dame.json \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
-H 'X-Goog-FieldMask: places.id,places.displayName,places.formattedAddress,places.location' \
'https://places.googleapis.com/v1/places:searchText'

เมื่อมีเนื้อหา "notre_date.json" สำหรับพารามิเตอร์การค้นหา ให้ทำดังนี้

{
   "textQuery": "Notre Dame, Paris",
   "languageCode": "en"
}

การตอบกลับคำขอข้างต้นจะให้พิกัดละติจูดและลองจิจูดต่อไปนี้

{
  "places": [
    {
      "id": "ChIJATr1n-Fx5kcRjQb6q6cdQDY",
      "formattedAddress": "6 Parvis Notre-Dame - Pl. Jean-Paul II, 75004 Paris, France",
      "location": {
        "latitude": 48.852968200000007,
        "longitude": 2.3499021
      },
      "displayName": {
        "text": "Cathédrale Notre-Dame de Paris",
        "languageCode": "en"
      }
    }
  ]
}

คุณจะเห็นว่าพิกัดดังกล่าวชี้ไปยังน็อทร์-ดามจริงๆ

รูปภาพทางเข้า Notre Dame แผนที่บริเวณน็อทร์ดาม

ในฐานะนักพัฒนาแอปหรือผู้ให้บริการ คุณควรแจ้งให้คนขับทราบโดยอัตโนมัติว่า "กำลังมองหาที่จอดรถใกล้กับนอเทรอดามใช่ไหม" หรือหากคนขับใช้รถยนต์ไฟฟ้า คุณอาจต้องการค้นหาสถานีชาร์จ ประสบการณ์ของผู้ใช้จะแตกต่างกันไปตามอุปกรณ์และหน้าจอ แต่ข้อความในกล่องโต้ตอบที่หายไปหลังจากผ่านไปครู่หนึ่งอาจเป็นตัวเลือกที่ควรพิจารณาในกรณีนี้ หากต้องการค้นหาที่จอดรถใกล้นอเทรอดาม ให้ค้นหา Places API ที่อยู่ใกล้เคียงโดยใช้ ประเภท "parking" และ "electric_vehicle_charging_station" โดยมีรัศมี 500 เมตร ตัวอย่างต่อไปนี้จะทำให้ผลการค้นหามุ่งเน้นไปที่พื้นที่จอดรถภายในรัศมี 500 เมตรจากนอเทรอดาม

curl -X POST -d '{
  "includedTypes": ["parking", "electric_vehicle_charging_station"],
  "maxResultCount": 10,
  "rankPreference": "DISTANCE",
  "locationRestriction": {
    "circle": {
      "center": {
        "latitude": 48.852968200000007,
        "longitude": 2.3499021},
      "radius": 500.0
    }
  }
}' \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
-H "X-Goog-FieldMask: places.displayName,places.location" \
https://places.googleapis.com/v1/places:searchNearby

ผลลัพธ์แรกคือสถานีชาร์จที่ 48.854981, 2.350629 แต่ผลลัพธ์ของคุณอาจแตกต่างออกไปเมื่อคุณเรียกใช้ตัวอย่างนี้ ใช้ตำแหน่งนี้ในส่วนถัดไป ซึ่งเราจะส่งคำขอ Routes API

2. คำขอ Routes API

หากต้องการค้นหาเส้นทางจากสถานีไปยังสถานีชาร์จใกล้กับนอเทรอดาม คุณต้องส่งคำขอ Routes API เพียงตั้งค่าพารามิเตอร์ต้นทางและปลายทาง ดูตัวเลือกเพิ่มเติมได้ที่เอกสารประกอบสำหรับนักพัฒนาซอฟต์แวร์

curl -X POST -d '{
  "origin":{
    "location":{
      "latLng":{
        "latitude": 48.87697775149635,
        "longitude": 2.3592247806755564
      }
    }
  },
  "destination":{
    "location":{
      "latLng":{
       "latitude": 48.854981,
        "longitude": 2.350629
      }
    }
  },
  "travelMode": "DRIVE",
  "routingPreference": "TRAFFIC_AWARE",
  "departureTime": "2024-05-16T15:01:23.045123456Z",
  "computeAlternativeRoutes": false,
  "routeModifiers": {
    "avoidTolls": false,
    "avoidHighways": false,
    "avoidFerries": false
  },
  "languageCode": "en-US",
  "units": "METRIC"
}' \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
-H 'X-Goog-FieldMask: routes.duration,routes.distanceMeters,routes.legs,routes.polyline.encodedPolyline' \
'https://routes.googleapis.com/directions/v2:computeRoutes'

โดยปกติแล้วการตอบกลับของ Routes API จะมีคำแนะนำเส้นทางหลายรายการ หากต้องการรวมข้อมูลเส้นทางไว้ในการตอบกลับ ให้กำหนด "routes.legs" ใน fieldmask แต่ละเส้นทางประกอบด้วย "ช่วง" หลายช่วง และแต่ละช่วงประกอบด้วย "ขั้นตอน" หลายขั้นตอนที่แสดงระยะทางและพิกัดการเดินทาง หากต้องการค้นหาพิกัดสุดท้ายที่เข้าถึงได้ด้วยรถยนต์ ให้ใช้ช่อง "endLocation" ของขั้นตอนสุดท้ายของช่วงสุดท้ายในเส้นทางที่คุณเลือก "latitude": 48.854937299999996, "longitude": 2.3505841999999997

แม้ว่าสถานที่นี้อาจดูเหมือนไม่ใช่ตัวเลือกแรก แต่เมื่อดูแผนที่ หรือ Google Street View คุณจะพบว่าสถานที่นี้อยู่ห่างจากนอเทรอดามโดยใช้เวลาเดินเพียงไม่นาน ประมาณ 6-7 นาที

เส้นทางไปยังนอเทรอดาม

เส้นทางเดินจากจุดจอดรถของสถานีชาร์จไปยังน็อทร์-ดาม

สรุปสำหรับตัวอย่างที่ 1

ดังที่เห็น การค้นหาพื้นที่จอดรถต้องใช้การเรียก API เพียงไม่กี่ครั้ง และแสดงคำแนะนำต่อผู้ขับ ซึ่งจะช่วยประหยัดเวลาให้ผู้ใช้ เนื่องจากไม่ต้องขับรถไปตามถนนวันเวย์หรือพยายามหาที่จอดรถในสถานที่ท่องเที่ยวที่มีผู้คนพลุกพล่าน โดยสรุป เราได้ดำเนินการคำขอ API ดังนี้

  • คำขอค้นหาข้อความ Places API เพื่อค้นหาพิกัดของนอเทรอดาม
  • การค้นหาใกล้เคียงของ Places API เพื่อค้นหาพื้นที่จอดรถที่มีสถานีชาร์จรถยนต์ไฟฟ้าภายใน 500 เมตรจากพิกัดเหล่านั้น
  • คำขอ Routes API เพื่อค้นหาเส้นทางไปยังสถานีชาร์จ

ตัวอย่างที่ 2 - การนำทางไปยังอาคารผู้โดยสารในสนามบินขนาดใหญ่

แผนที่สนามบินฮีทโธรว์

ลองพิจารณาตัวอย่างอื่นที่คนขับพยายามเข้าถึงพื้นที่ขนาดใหญ่ที่มีสถานที่ POI หรือจุดลงรถที่อาจจะเกิดขึ้นได้หลายแห่ง คนขับรถกำลังออกเดินทางจากสนามกีฬาเวมบลีย์ สหราชอาณาจักร (51.557263604707224, -0.2794575145680608) และพยายามไปที่สนามบินลอนดอนฮีทโธรว์ อาคาร 5

ข้อดีของฟีเจอร์เติมข้อความอัตโนมัติของ Places API ใหม่คือความสามารถในการกำหนดประเภทหลักเป็นเกณฑ์การค้นหาร่วมกับ API ที่คาดคะเนสถานที่ย่อยเป็นผลการค้นหาที่เป็นไปได้ ในกรณีนี้หมายความว่าการค้นหาสนามบินและที่จอดรถจะแสดงอาคารผู้โดยสารหรือที่จอดรถด้วย คุณสามารถดูรายการประเภททั้งหมดที่จะรวมหรือไม่รวมได้ในเอกสารประกอบ

curl -X POST -d '{
  "input": "Heathrow",
  "includedPrimaryTypes": ["airport", "parking"]
}' \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
https://places.googleapis.com/v1/places:autocomplete

คําค้นหาข้างต้นจะแสดงรายการสถานีและจุดส่งทีละจุด ที่สถานีเหล่านั้น จากรายการผลการค้นหา เราจะเห็น "London Heathrow Airport Terminal 5" และรหัสสถานที่ของอาคารผู้โดยสารนี้

"place_id" : "ChIJo21hnPxxdkgRksRL0KQRWII",

การใช้พารามิเตอร์ "placeId" ช่วยให้เราสามารถแจ้ง Routes API ได้ว่าเรากำลังพยายามเข้าถึงสถานที่แห่งหนึ่ง แทนที่จะใช้พิกัดที่กำหนดโดยพลการ

curl -X POST -d '{
  "origin":{
    "location":{
      "latLng":{
        "latitude": 51.557263604707224,
        "longitude": -0.2794575145680608
      }
    }
  },
  "destination":{
    "placeId": "ChIJo21hnPxxdkgRksRL0KQRWII"
  },
  "travelMode": "DRIVE",
  "routingPreference": "TRAFFIC_AWARE",
  "departureTime": "2024-05-16T15:01:23.045123456Z",
  "computeAlternativeRoutes": false,
  "languageCode": "en-US",
  "units": "METRIC"
}' \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
-H 'X-Goog-FieldMask: routes.duration,routes.distanceMeters,routes.legs,routes.polyline.encodedPolyline' \
'https://routes.googleapis.com/directions/v2:computeRoutes'

อีกครั้ง เช่นเดียวกับตัวอย่างก่อนหน้านี้ เมื่อคุณอ่านขั้นตอนทั้งหมดในการตอบกลับ JSON คุณจะพบส่วนสุดท้ายของการเดินทางและตำแหน่งสิ้นสุด พิกัดละติจูดและลองจิจูด (51.4714348, "ลองจิจูด": -0.48967890000000003)

วิวถนนอาคารผู้โดยสาร 5

สรุปสำหรับตัวอย่างที่ 2

เช่นเดียวกับในตัวอย่างก่อนหน้า ความพยายามในการพัฒนาเพื่อให้คำแนะนำที่ดีขึ้นแก่ผู้ขับขี่นั้นน้อยมาก และสามารถวัดผลประโยชน์ในด้านเวลาที่ประหยัดได้สำหรับผู้ขับขี่ เราได้ดำเนินการตามคำขอต่อไปนี้

  • คำขอกรอกอัตโนมัติ API ของ Places (ใหม่) เพื่อค้นหาอาคารผู้โดยสาร 5 ของสนามบิน Heathrow
  • คำขอ Routes API เพื่อรับเส้นทางจากเวมบลีย์ไปยังอาคารผู้โดยสาร 5

ตัวอย่างนี้เป็นเพียงการเริ่มต้นของฟีเจอร์ Places API ใหม่เท่านั้น ลองดูประเภทสถานที่ใหม่ๆ เช่น สนามบินและสนามบินนานาชาติ

บทสรุป

ดังที่เห็นได้ว่า ความพยายามในการพัฒนาที่จำเป็นต่อการให้บริการระดับพรีเมียมแก่ ลูกค้าที่เดินทางโดยรถยนต์นั้นค่อนข้างน้อย และคุณสามารถแสดงให้เห็นว่าคุณ คำนึงถึงความต้องการของลูกค้าอย่างไร

เพื่อวัตถุประสงค์ในการพัฒนา คุณสามารถใช้ไลบรารีและเครื่องมือที่มีอยู่มากมาย เพื่อช่วยสร้างบริการสำหรับลูกค้า ดูที่เก็บ GitHub สำหรับ Google Maps Platform ที่เราเปิดให้ใช้งานแก่สาธารณะ

การดำเนินการถัดไป

เริ่มต้นใช้งาน GMP : https://developers.google.com/maps/get-started

อ่านเพิ่มเติมที่แนะนำ

เอกสารประกอบการกรอกอัตโนมัติของ API สถานที่ (ใหม่): https://developers.google.com/maps/documentation/places/web-service/place-autocomplete

เอกสารประกอบของ Routes API : https://developers.google.com/maps/documentation/routes

ผู้ร่วมให้ข้อมูล

ผู้เขียนหลัก: Mikko Toivanen | วิศวกรโซลูชันแพลตฟอร์ม Google Maps