Serviços de imagens com zoom máximo

  1. Maximum Zoom Imagery
  2. Solicitações de MaxZoom
  3. Respostas de MaxZoom

Visão geral

A API Google Maps disponibiliza blocos de mapas em vários níveis de zoom para imagens de tipos de mapa. A maioria das imagens de roteiros, por exemplo, está disponível nos níveis de zoom de 0 a 18. As imagens de satélite variam mais, porque não são geradas, mas fotografadas diretamente.

Como as imagens de satélite nem sempre estão disponíveis em altos níveis de zoom em locais remotos, como áreas pouco povoadas ou no oceano, convém saber com antecedência o nível de zoom mais alto das imagens em um determinado local. O objeto MaxZoomService oferece uma interface simples para descobrir o nível de zoom máximo em um determinado local que tem imagens de satélite no Google Maps.

Solicitações de MaxZoom

O acesso ao MaxZoomService é assíncrono, porque a API Google Maps precisa fazer uma chamada para um servidor externo. Portanto, você precisa transmitir um método de callback a ser executado após a conclusão da solicitação. Esse método deve processar o resultado.

Para iniciar uma solicitação ao MaxZoomService, chame getMaxZoomAtLatLng(), transmitindo o LatLng do local e uma função de callback a ser executada após a solicitação ser concluída.

Respostas de MaxZoom

Quando executa a função de callback, getMaxZoomAtLatLng() devolve dois parâmetros:

  • status contém o objeto MaxZoomStatus da solicitação.
  • zoom contém o nível de zoom. Se o serviço falhar, este valor não vai aparecer.

O código status pode retornar um destes valores:

  • OK: indica que o serviço encontrou o nível de zoom máximo das imagens de satélite.
  • ERROR: indica que não foi possível processar a solicitação de MaxZoom.

O exemplo abaixo mostra um mapa da região metropolitana de Tóquio. Ao clicar em qualquer lugar do mapa, o nível de zoom máximo do local aparece. Os níveis de zoom ao redor de Tóquio costumam variar entre 18 e 21.

TypeScript

let map: google.maps.Map;
let maxZoomService: google.maps.MaxZoomService;
let infoWindow: google.maps.InfoWindow;

function initMap(): void {
  map = new google.maps.Map(document.getElementById("map") as HTMLElement, {
    zoom: 11,
    center: { lat: 35.6894, lng: 139.692 },
    mapTypeId: "hybrid",
  });

  infoWindow = new google.maps.InfoWindow();

  maxZoomService = new google.maps.MaxZoomService();

  map.addListener("click", showMaxZoom);
}

function showMaxZoom(e: google.maps.MapMouseEvent) {
  maxZoomService.getMaxZoomAtLatLng(
    e.latLng as google.maps.LatLng,
    (result: google.maps.MaxZoomResult) => {
      if (result.status !== "OK") {
        infoWindow.setContent("Error in MaxZoomService");
      } else {
        infoWindow.setContent(
          "The maximum zoom at this location is: " + result.zoom
        );
      }

      infoWindow.setPosition(e.latLng);
      infoWindow.open(map);
    }
  );
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;
index.ts

JavaScript

let map;
let maxZoomService;
let infoWindow;

function initMap() {
  map = new google.maps.Map(document.getElementById("map"), {
    zoom: 11,
    center: { lat: 35.6894, lng: 139.692 },
    mapTypeId: "hybrid",
  });
  infoWindow = new google.maps.InfoWindow();
  maxZoomService = new google.maps.MaxZoomService();
  map.addListener("click", showMaxZoom);
}

function showMaxZoom(e) {
  maxZoomService.getMaxZoomAtLatLng(e.latLng, (result) => {
    if (result.status !== "OK") {
      infoWindow.setContent("Error in MaxZoomService");
    } else {
      infoWindow.setContent(
        "The maximum zoom at this location is: " + result.zoom,
      );
    }

    infoWindow.setPosition(e.latLng);
    infoWindow.open(map);
  });
}

window.initMap = initMap;
index.js
Exemplo

Testar amostra

JSFiddle.net (link em inglês) Google Cloud Shell