Isochrones API レスポンスを処理して可視化する

等時線 API は、標準の GeoJSON 形式でジオメトリを返します。レスポンスには MultiPolygon ジオメトリ オブジェクトが含まれます。

到達可能な等時線エリアは、必ずしも連続した単一の形状ではありません。たとえば、橋は島へのアクセスを可能にし、本土から分離された到達可能なエリアを作成します。また、私有地や湖など、アクセスできないエリアは、メインのポリゴン内に穴を作成します。

次の例は、一般的なレスポンス形式を示しています。GeoJSON は [longitude, latitude] 座標順序に準拠しています。

{
  "isochrone": {
    "geoJson": {
      "type": "MultiPolygon",
      "coordinates": [
        [
          [
            [-122.332100, 47.606200],
            [-122.332200, 47.606300],
            ...
          ]
        ]
      ]
    }
  }
}

地図上に等時線を可視化する

API は標準の GeoJSON を返すため、Maps JavaScript API を使用してレスポンスを可視化できます。google.maps.Data クラスは GeoJSON をネイティブにサポートしているため、[longitude, latitude] 座標の順序を手動で逆にする必要はありません。

次の JavaScript スニペットは、API レスポンスを地図に直接追加する方法を示しています。

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

const isochroneGeoJson = response.isochrone.geoJson;

// Add the GeoJSON directly to the map's data layer
map.data.addGeoJson(isochroneGeoJson);

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