Processar e visualizar a resposta da API Isochrones

A API Isochrones retorna a geometria no formato GeoJSON padrão, em conformidade com a RFC 7946. A resposta sempre contém um objeto de geometria MultiPolygon em isochrone.geoJson (isochrone.geo_json no gRPC):

  • Ordem das coordenadas: cada posição é um par [longitude, latitude] em graus decimais WGS 84.
  • Vários polígonos (coordinates[i]): as áreas de isócrono alcançáveis podem consistir em vários polígonos separados (por exemplo, quando uma ponte ou um túnel de alta velocidade se conecta a um bolso alcançável separado ou quando um polígono que cruza o antimeridiano ±180° é dividido ao longo do meridiano de acordo com a RFC 7946 §3.1.9).
  • Cascas externas e furos internos (coordinates[i][j]): em cada polígono coordinates[i], o primeiro anel linear (coordinates[i][0]) é a casca externa no sentido anti-horário, e todos os anéis lineares subsequentes (coordinates[i][1..k]) representam furos internos (como lagos, parques ou bolsões não mapeados) no sentido horário, de acordo com a regra da mão direita da RFC 7946 §3.1.6. Cada anel linear é fechado (as primeiras e últimas posições de [longitude, latitude] são idênticas).

O exemplo a seguir mostra uma resposta MultiPolygon que contém um polígono principal com um furo interno e um segundo polígono separado:

{
  "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]
          ]
        ]
      ]
    }
  }
}

Visualizar a isócrona em um mapa

Como a API retorna um GeoJSON padrão, é possível visualizar a resposta usando a API Maps JavaScript. A classe google.maps.Data é compatível de forma nativa com o GeoJSON, o que significa que você não precisa inverter manualmente a ordem das coordenadas [longitude, latitude].

O snippet de JavaScript a seguir demonstra como adicionar a resposta da API diretamente a um mapa:

// 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
});