จัดการและแสดงภาพการตอบกลับจาก Isochrones API

Isochrones API จะแสดงผลเรขาคณิตในรูปแบบ GeoJSON มาตรฐานที่เป็นไปตาม RFC 7946 การตอบกลับจะมีออบเจ็กต์เรขาคณิต MultiPolygon ภายใต้ isochrone.geoJson (isochrone.geo_json ใน gRPC) เสมอ

• ลำดับพิกัด: ทุกตำแหน่งเป็นคู่ [longitude, latitude] ในองศาทศนิยม WGS 84
• รูปหลายเหลี่ยมหลายรูป (coordinates[i]): พื้นที่ Isochrone ที่เข้าถึงได้อาจประกอบด้วยรูปหลายเหลี่ยมที่แยกจากกันหลายรูป (เช่น เมื่อสะพานหรืออุโมงค์ความเร็วสูงเชื่อมต่อกับพื้นที่ที่เข้าถึงได้แยกต่างหาก หรือเมื่อรูปหลายเหลี่ยมที่ตัดผ่านเส้นแอนติเมอริเดียน ±180° ถูกแบ่งตามเส้นเมอริเดียนตาม RFC 7946 §3.1.9)
• เปลือกนอกและรูด้านใน (coordinates[i][j]): ภายในรูปหลายเหลี่ยม coordinates[i] แต่ละรูป วงแหวนเชิงเส้นแรก (coordinates[i][0]) คือเปลือกนอกที่พันทวนเข็มนาฬิกา และวงแหวนเชิงเส้นที่ตามมา (coordinates[i][1..k]) แสดงถึงรูด้านใน (เช่น ทะเลสาบ สวนสาธารณะ หรือพื้นที่ที่ไม่ได้แมป) ที่พันตามเข็มนาฬิกาตามกฎมือขวา RFC 7946 §3.1.6 วงแหวนเชิงเส้นทุกวงจะปิด (ตำแหน่ง [longitude, latitude] แรกและสุดท้ายเหมือนกัน)

ตัวอย่างต่อไปนี้แสดงการตอบกลับ MultiPolygon ที่มีรูปหลายเหลี่ยมหลักซึ่งมีรูด้านในและรูปหลายเหลี่ยมที่แยกจากกันรูปที่ 2

{
  "isochrone": {
    "geoJson": {
      "type": "MultiPolygon",
      "coordinates": [
        [
          [
            [-122.340000, 47.600000],
            [-122.320000, 47.600000],
            [-122.320000, 47.615000],
            [-122.340000, 47.615000],
            [-122.340000, 47.600000]
          ],
          [
            [-122.334000, 47.604000],
            [-122.334000, 47.609000],
            [-122.328000, 47.609000],
            [-122.328000, 47.604000],
            [-122.334000, 47.604000]
          ]
        ],
        [
          [
            [-122.355000, 47.602000],
            [-122.348000, 47.602000],
            [-122.348000, 47.608000],
            [-122.355000, 47.608000],
            [-122.355000, 47.602000]
          ]
        ]
      ]
    }
  }
}

แสดงภาพ Isochrone บนแผนที่

เนื่องจาก API แสดงผล GeoJSON มาตรฐาน คุณจึงแสดงภาพการตอบกลับได้โดยใช้ Maps JavaScript API คลาส google.maps.Data รองรับ GeoJSON โดยค่าเริ่มต้น ซึ่งหมายความว่าคุณไม่จำเป็นต้องกลับลำดับพิกัด [longitude, latitude] ด้วยตนเอง

ข้อมูลโค้ด JavaScript ต่อไปนี้แสดงวิธีเพิ่มการตอบกลับจาก API ลงในแผนที่โดยตรง

// Assume 'map' is an initialized google.maps.Map object
// and 'responseData' is the parsed JSON payload returned by the Isochrones API.

const isochroneGeoJson = responseData.isochrone.geoJson;

// Wrap the geometry in a standard GeoJSON Feature
const geoJsonFeature = {
    type: "Feature",
    geometry: isochroneGeoJson,
    properties: {}
};

// Add the GeoJSON Feature to the map's data layer
map.data.addGeoJson(geoJsonFeature);

// Optional: Apply custom styling to the isochrone polygon
map.data.setStyle({
    fillColor: '#4285F4',
    fillOpacity: 0.3,
    strokeColor: '#4285F4',
    strokeWeight: 2
});