ขอไทม์ไลน์ของเส้นทาง

นักพัฒนาแอปในเขตเศรษฐกิจยุโรป (EEA)

ทั้งเมธอด computeRoutes (REST) และเมธอด ComputeRoutes (gRPC) จะแสดงเส้นทางที่แสดงด้วย Polyline เป็นส่วนหนึ่งของ การตอบกลับ API เหล่านี้จะแสดงผลเส้นหลายเส้น 2 ประเภท ได้แก่

ดูข้อมูลเพิ่มเติมเกี่ยวกับเส้นหลายส่วนได้ที่

ขอเส้นประกอบพื้นฐานสำหรับเส้นทาง ขา หรือขั้นตอน

เส้นประกอบแสดงด้วยออบเจ็กต์ Polyline (REST) หรือ Polyline (gRPC) คุณสามารถ ส่งคืนเส้นประกอบในการตอบกลับที่ระดับเส้นทาง ขา และขั้นตอน

ระบุเส้นหลายเส้นที่จะแสดงผลโดยใช้ฟิลด์การตอบกลับ มาสก์

  • ที่ระดับเส้นทาง ให้แสดงผล Polyline ในการตอบกลับโดยใส่ routes.polyline ในมาสก์ช่องการตอบกลับ

  • ที่ระดับช่วง ให้ส่งคืนเส้นหลายเส้นในการตอบกลับสำหรับแต่ละช่วงของเส้นทางโดยใส่ routes.legs.polyline

  • ที่ระดับขั้นตอน ให้ส่งคืนเส้นหลายเส้นในการตอบกลับสำหรับแต่ละขั้นตอนของ ขาโดยใส่ routes.legs.steps.polyline

ตัวอย่างเช่น หากต้องการแสดงผลเส้นประกอบสำหรับทั้งเส้นทาง สำหรับแต่ละช่วง และสำหรับ แต่ละขั้นตอนของแต่ละช่วง ให้ทำดังนี้

curl -X POST -d '{
  "origin":{
    "address": "1600 Amphitheatre Parkway, Mountain View, CA"
  },
  "destination":{
    "address": "24 Willie Mays Plaza, San Francisco, CA 94107"
  },
  "travelMode": "DRIVE"
}' \
-H 'Content-Type: application/json' \
-H 'X-Goog-Api-Key: YOUR_API_KEY' \
-H 'X-Goog-FieldMask: routes.duration,routes.distanceMeters,routes.polyline,routes.legs.polyline,routes.legs.steps.polyline' \
'https://routes.googleapis.com/directions/v2:computeRoutes'

คำขอนี้จะแสดงการตอบกลับต่อไปนี้ ซึ่งรวมถึงเส้นหลายเส้นสำหรับเส้นทาง สำหรับแต่ละช่วงของเส้นทาง และสำหรับแต่ละขั้นตอนของช่วง

{
  "routes": [
    {
      "legs": [
        {
          "polyline": {
              "encodedPolyline": "ipkcFfich...@Bs@?A?O?SD{A@o@B}@I?qA?_AA_@@_@?"
          }
        },
          "steps": [
              {
                  "polyline": {
                      "encodedPolyline": "kclcF...@sC@YIOKI"
                  }
              },
              {
                  "polyline": {
                      "encodedPolyline": "wblcF~...SZSF_@?"
                  }
              },
              ...
      ],
      "distanceMeters": 56901,
      "duration": "2420s",
      "polyline": {
        "encodedPolyline": "ipkcFfich...@Bs@?A?O?SD{A@o@B}@I?qA?_AA_@@_@?"
      }
    }
  ]
}

เนื่องจากคำขอนี้มีเพียงต้นทางและปลายทาง เส้นทางที่ส่งคืนจึงมีเพียงขาเดียว ดังนั้น เส้นประกอบสำหรับขาและเส้นประกอบสำหรับเส้นทางจึงเหมือนกัน

หากคุณเพิ่มจุดแวะพักกลางลงในคำขอ เส้นทางที่ส่งคืนจะมี 2 ขา ดังนี้ 

curl -X POST -d '{
  "origin":{
    "address": "1600 Amphitheatre Parkway, Mountain View, CA"
  },
  "destination":{
    "address": "24 Willie Mays Plaza, San Francisco, CA 94107"
  },
  "intermediates": [
    { "address": "450 Serra Mall, Stanford, CA 94305, USA"},
  ],
  "travelMode": "DRIVE",
}' \
-H 'Content-Type: application/json' \
-H 'X-Goog-Api-Key: YOUR_API_KEY' \
-H 'X-Goog-FieldMask: routes.duration,routes.distanceMeters,routes.polyline,routes.legs.polyline' \
'https://routes.googleapis.com/directions/v2:computeRoutes'

คำขอนี้จะแสดงผล 2 ขา โดยแต่ละขามีเส้นหลายเส้นที่ไม่ซ้ำกัน และเส้นหลายเส้นสำหรับ เส้นทางทั้งหมด

{
  "routes": [
    {
      "legs": [
        {
          "polyline": {
            "encodedPolyline": "kclcFfqchV?A...?I@G?GAECCCEKICBAFG"
          }
          "steps": [
            {
                "polyline": {
                    "encodedPolyline": "kclcFfqch...YIOKI"
                }
            },
        ...
        },
        {
          "polyline": {
            "encodedPolyline": "ojmcFtethV?K...QOYQOGA?_@MUG[Ga@G"
          }
          "steps": [
            {
                "polyline": {
                    "encodedPolyline": "uypeFbo`jVgJq...PoBiC"
                }
            },
        ...
        }
      ],
      "distanceMeters": 68403,
      "duration": "3759s",
      "polyline": {
          "encodedPolyline": "kclcFfqchV?A?CBKF[Ha...?GAECCCEKICBAFGJEBE"
      }
    }
  ]
}

คุณภาพของเส้นประกอบ

คุณภาพของเส้นประกอบสามารถอธิบายได้ในข้อกำหนดต่อไปนี้

  • ความแม่นยำของจุดลอยตัวของจุด

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

    ในเมธอด computeRoutes (REST) และ ComputeRoutes polylineEncoding จะเป็นตัวควบคุม

  • จำนวนจุดที่ประกอบกันเป็นเส้นหลายส่วน

    ยิ่งมีจุดมากเท่าใด เส้นหลายเหลี่ยมก็จะยิ่งราบรื่นมากขึ้น (โดยเฉพาะในส่วนโค้ง)

    ในเมธอด computeRoutes (REST) และ ComputeRoutes polylineQuality จะเป็นตัวควบคุม

กำหนดค่าประเภทการเข้ารหัสเส้นประกอบ

ใช้polylineEncodingตัวเลือกคำขอเพื่อควบคุมประเภทเส้นหลายเส้น พร็อพเพอร์ตี้ polylineEncoding ควบคุมว่าจะเข้ารหัสเส้นหลายเส้นเป็น ENCODED_POLYLINE (ค่าเริ่มต้น) หรือไม่ ซึ่งหมายความว่าจะใช้รูปแบบอัลกอริทึมเส้นหลายเส้นที่เข้ารหัส หรือ GEO_JSON_LINESTRING ซึ่งหมายความว่าจะใช้รูปแบบ GeoJSON LineString

เช่น ในเนื้อความของคำขอ

curl -X POST -d '{
  "origin":{
    "address": "1600 Amphitheatre Parkway, Mountain View, CA"
  },
  "destination":{
    "address": "24 Willie Mays Plaza, San Francisco, CA 94107"
  },
  "travelMode": "DRIVE",
  "polylineEncoding": "ENCODED_POLYLINE"
}' \
-H 'Content-Type: application/json' \
-H 'X-Goog-Api-Key: YOUR_API_KEY' \
-H 'X-Goog-FieldMask: routes.duration,routes.distanceMeters,routes.polyline,routes.legs.polyline' \
'https://routes.googleapis.com/directions/v2:computeRoutes'

กำหนดค่าคุณภาพโพลีไลน์

polylineQuality ระบุคุณภาพของเส้นหลายส่วนเป็น HIGH_QUALITY หรือ OVERVIEW (ค่าเริ่มต้น) OVERVIEW จะประกอบด้วยเส้นหลายเส้นโดยใช้จุดจำนวนเล็กน้อย และมีเวลาในการตอบสนองคำขอน้อยกว่า HIGH_QUALITY

เช่น ในเนื้อความของคำขอ

{
  "origin":{
    "location":{
      "latLng":{
        "latitude": 37.419734,
        "longitude": -122.0827784
      }
    }
  },
  "destination":{
    "location":{
      "latLng":{
        "latitude": 37.417670,
        "longitude": -122.079595
      }
    }
  },
  "travelMode": "DRIVE",
  "routingPreference": "TRAFFIC_AWARE",
  "polylineQuality": "HIGH_QUALITY",
  "polylineEncoding": "ENCODED_POLYLINE",
  "departureTime": "2023-10-15T15:01:23.045123456Z",
  ...
}

ขอเส้นประกอบที่รับรู้การจราจร

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

Polyline ที่รับรู้การจราจรมีข้อมูลเกี่ยวกับสภาพการจราจรตาม เส้นทาง สภาพการจราจรจะแสดงในรูปแบบหมวดหมู่ความเร็ว (NORMAL, SLOW, TRAFFIC_JAM) สำหรับช่วงเวลาที่กำหนดของเส้นประกอบการตอบกลับ โดยช่วงเวลาจะกำหนดโดยดัชนีของจุดเริ่มต้น (รวม) และจุดสิ้นสุด (ไม่รวม) ของเส้นประกอบ

ตัวอย่างเช่น การตอบกลับต่อไปนี้แสดงการเข้าชม NORMAL ระหว่างจุด 2 และ 4 ของเส้นหลายเส้น 

{
  "startPolylinePointIndex": 2,
  "endPolylinePointIndex": 4,
  "speed": "NORMAL"
}

หากต้องการส่งคำขอเพื่อคำนวณเส้นหลายจุดที่พิจารณาการจราจร ให้ตั้งค่าพร็อพเพอร์ตี้ต่อไปนี้ ในคำขอ

  • ตั้งค่าฟิลด์อาร์เรย์ extraComputations เป็น TRAFFIC_ON_POLYLINE เพื่อเปิดใช้ การคำนวณการเข้าชม

  • ตั้งค่า travelMode เป็น DRIVE หรือ TWO_WHEELER คำขอสำหรับ รูปแบบการเดินทางอื่นๆ จะแสดงข้อผิดพลาด

  • ระบุค่ากำหนดการกำหนดเส้นทาง TRAFFIC_AWARE หรือ TRAFFIC_AWARE_OPTIMAL ในคำขอ ดูข้อมูลเพิ่มเติมได้ที่หัวข้อกำหนดค่าคุณภาพ เทียบกับเวลาในการตอบสนอง

  • ตั้งค่ามาสก์ฟิลด์การตอบกลับที่ระบุให้แสดงผลพร็อพเพอร์ตี้การตอบกลับ

    • ที่ระดับเส้นทาง ให้แสดงข้อมูลการเดินทางทั้งหมดในการตอบกลับโดย รวม routes.travelAdvisory ไว้ในมาสก์ฟิลด์การตอบกลับ หากต้องการแสดงเฉพาะข้อมูลการเข้าชม ให้ระบุ routes.travelAdvisory.speedReadingIntervals

    • ที่ระดับช่วงการเดินทาง ให้ส่งคืนข้อมูลการเดินทางทั้งหมดในการตอบกลับสำหรับ ช่วงการเดินทางแต่ละช่วงของเส้นทางโดยใส่ routes.legs.travelAdvisory หากต้องการแสดงเฉพาะข้อมูลการเข้าชม ให้ระบุ routes.legs.travelAdvisory.speedReadingIntervals

curl -X POST -d '{
  "origin":{
    "address": "1600 Amphitheatre Parkway, Mountain View, CA"
  },
  "destination":{
    "address": "24 Willie Mays Plaza, San Francisco, CA 94107"
  },
  "travelMode": "DRIVE",
  "extraComputations": ["TRAFFIC_ON_POLYLINE"],
  "routingPreference": "TRAFFIC_AWARE_OPTIMAL"
}' \
-H 'Content-Type: application/json' \
-H 'X-Goog-Api-Key: YOUR_API_KEY' \
-H 'X-Goog-FieldMask: routes.duration,routes.distanceMeters,routes.polyline,routes.legs.polyline,routes.travelAdvisory,routes.legs.travelAdvisory' \
'https://routes.googleapis.com/directions/v2:computeRoutes'

ตัวอย่างการตอบกลับสำหรับเส้นหลายส่วนที่รับรู้การจราจร

ในการตอบกลับ ระบบจะเข้ารหัสข้อมูลการเข้าชมในโพลีไลน์และอยู่ในฟิลด์ travelAdvisory ซึ่งเป็นออบเจ็กต์ประเภท RouteLegTravelAdvisory (แต่ละช่วง) และออบเจ็กต์ RouteTravelAdvisory (เส้นทาง)

เช่น

{
  "routes": [
    {
      "legs": {
        "polyline": {
          "encodedPolyline": "}boeF~zbjVAg@EmB`GWHlD"
        },
        // Traffic data for the leg.
        "travelAdvisory": {
          "speedReadingIntervals": [
            {
              "endPolylinePointIndex": 1,
              "speed": "NORMAL"
            },
            {
              "startPolylinePointIndex": 1,
              "endPolylinePointIndex": 2,
              "speed": "SLOW"
            },
            {
              "startPolylinePointIndex": 2,
              "endPolylinePointIndex": 4,
              "speed": "NORMAL"
            }
          ] 
        }
      },
      "polyline": {
        "encodedPolyline": "}boeF~zbjVAg@EmB`GWHlD"
      },
      // Traffic data for the route.
      "travelAdvisory": {
        "speedReadingIntervals": [
          {
            "endPolylinePointIndex": 1,
            "speed": "NORMAL"
          },
          {
            "startPolylinePointIndex": 1,
            "endPolylinePointIndex": 2,
            "speed": "SLOW"
          },
          {
            "startPolylinePointIndex": 2,
            "endPolylinePointIndex": 4,
            "speed": "NORMAL"
          }
        ] 
      }
    }
  ]
}

ทั้ง RouteTravelAdvisory และ RouteLegTravelAdvisory มีฟิลด์อาร์เรย์ ชื่อ speedReadingIntervals ซึ่งมีข้อมูลความเร็วของการจราจร แต่ละออบเจ็กต์ในอาร์เรย์จะแสดงด้วยออบเจ็กต์ SpeedReadingInterval (REST) หรือ SpeedReadingInterval (gRPC)

ออบเจ็กต์ SpeedReadingInterval มีการอ่านความเร็วสำหรับช่วงเส้นทาง เช่น NORMAL, SLOW หรือ TRAFFIC_JAM อาร์เรย์ของออบเจ็กต์ทั้งหมดครอบคลุม เส้นประกอบทั้งหมดของเส้นทางโดยไม่มีการทับซ้อนกัน จุดเริ่มต้นของช่วงเวลาที่ระบุ จะเหมือนกับจุดสิ้นสุดของช่วงเวลาก่อนหน้า

แต่ละช่วงจะอธิบายด้วยstartPolylinePointIndex, endPolylinePointIndex และหมวดหมู่ความเร็วที่เกี่ยวข้อง โปรดทราบว่าการ ไม่มีดัชนีเริ่มต้นภายในช่วงเวลาจะสอดคล้องกับดัชนี 0 ตามแนวทางปฏิบัติของ proto3

ค่า startPolylinePointIndex และ endPolylinePointIndex อาจไม่ต่อเนื่องเสมอไป เช่น

{
  "startPolylinePointIndex": 2,
  "endPolylinePointIndex": 4,
  "speed": "NORMAL"
}

ในกรณีนี้ สภาพการจราจรจากดัชนี 2 ถึงดัชนี 4 เหมือนกัน

แสดงผลเส้นหลายส่วนที่รับรู้การจราจรด้วย Maps SDK

เราขอแนะนำให้แสดงเส้นหลายส่วนที่รับรู้การจราจรบนแผนที่โดยใช้ฟีเจอร์ต่างๆ ที่ SDK ของ Google Maps มีให้ ซึ่งรวมถึงการกำหนดสีเอง เส้นขีด และรูปแบบต่างๆ ตามแนวเส้นหลายส่วน ดูรายละเอียดเพิ่มเติมเกี่ยวกับการใช้เส้นหลายส่วนได้ที่ฟีเจอร์เส้นหลายส่วนสำหรับ Android และฟีเจอร์ เส้นหลายส่วนสำหรับ iOS

ตัวอย่างการแสดงผลโพลีไลน์

ผู้ใช้ Maps SDK มีโอกาสกำหนดตรรกะการแมปที่กำหนดเอง ระหว่างหมวดหมู่ความเร็วและสคีมาการแสดงผล Polyline ตัวอย่างเช่น ผู้ใช้บางรายอาจเลือกแสดงความเร็ว "ปกติ" เป็นเส้นสีน้ำเงินหนาบนแผนที่ ขณะที่ความเร็ว "ช้า" อาจแสดงเป็นเส้นสีส้มหนา เป็นต้น

ข้อมูลโค้ดต่อไปนี้จะเพิ่มเส้นหลายเส้นสีน้ำเงินหนาที่มีส่วนโค้งตามพื้นผิวโลกจาก เมลเบิร์นไปยังเพิร์ธ ดูข้อมูลเพิ่มเติมได้ที่การปรับแต่ง ลักษณะที่ปรากฏ (สำหรับ Android) และปรับแต่ง เส้น (สำหรับ iOS)

Android

Java

Polyline line = map.addPolyline(new PolylineOptions()
    .add(new LatLng(-37.81319, 144.96298), new LatLng(-31.95285, 115.85734))
    .width(25)
    .color(Color.BLUE)
    .geodesic(true));

Kotlin

val line: Polyline = map.addPolyline(
  PolylineOptions()
    .add(LatLng(-37.81319, 144.96298), LatLng(-31.95285, 115.85734))
    .width(25f)
    .color(Color.BLUE)
    .geodesic(true)
)

iOS

Objective-C

GMSMutablePath *path = [GMSMutablePath path];
[path addLatitude:-37.81319 longitude:144.96298];
[path addLatitude:-31.95285 longitude:115.85734];
GMSPolyline *polyline = [GMSPolyline polylineWithPath:path];
polyline.strokeWidth = 10.f;
polyline.strokeColor = .blue;
polyline.geodesic = YES;
polyline.map = mapView;

Swift

let path = GMSMutablePath()
path.addLatitude(-37.81319, longitude: 144.96298)
path.addLatitude(-31.95285, longitude: 115.85734)
let polyline = GMSPolyline(path: path)
polyline.strokeWidth = 10.0
polyline.geodesic = true
polyline.map = mapView

ใช้ Polyline ที่เข้ารหัสกับการค้นหาตามเส้นทาง

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

เช่น หากต้องการดูคาเฟ่ตามเส้นทางระหว่างต้นทางกับจุดหมาย ให้ทำดังนี้

Node.js

const API_KEY = 'YOUR_API_KEY';
const routes_service = 'https://routes.googleapis.com/directions/v2:computeRoutes';
const textSearch_service = 'https://places.googleapis.com/v1/places:searchText';



function init(){
    const routes_request = {
        "origin":{
            "address": "1600 Amphitheatre Parkway, Mountain View, CA"
        },
        "destination":{
            "address": "24 Willie Mays Plaza, San Francisco, CA 94107"
        },
        "travelMode": "DRIVE"
    };
    const textSearch_request = {
        "textQuery": "cafe",
        "searchAlongRouteParameters": {
            "polyline": {
                "encodedPolyline": ""
            }
        }
    };
    fetchResources(routes_service,routes_request).then(routes => {
        textSearch_request.searchAlongRouteParameters.polyline.encodedPolyline = routes.routes[0].polyline.encodedPolyline;
        fetchResources(textSearch_service,textSearch_request).then(places => {
            console.log(places);
        });
    });
}
async function fetchResources(resource,reqBody){
    const response = await fetch(resource, {
        method: 'POST',
        body: JSON.stringify(reqBody),
        headers: {
            'Content-Type': 'application/json',
            'X-Goog-Api-Key': API_KEY,
            'X-Goog-FieldMask': '*'
        }
    });
    const responseJSON = await response.json();
    return responseJSON;
}
init();