
Visão geral
A solução 3D Area Explorer oferece uma maneira totalmente nova de descobrir e conhecer locais. Essa solução aproveita os recursos dos blocos fotorrealistas em 3D da Plataforma Google Maps e da API Places para criar ambientes 3D cativantes e interativos.
O 3D Area Explorer foi projetado para atender a vários propósitos:
Melhorar a análise de áreas: os usuários podem conhecer bairros virtualmente com um alto grau de detalhes visuais, recebendo insights sobre características e pontos de referência locais.
Promover narrativas baseadas em localização: a capacidade de incorporar pontos de interesse (PDIs) com descrições detalhadas permite a criação de experiências baseadas em narrativas que educam e informam os usuários sobre locais específicos.
Inspirar o desenvolvimento usando os recursos 3D do Google Maps: demonstra o potencial dos dados de mapeamento 3D do Google para criar mapas imersivos e interativos.
Primeiros passos
Ativar
Principais tecnologias
Essa solução é criada usando duas tecnologias principais:
APIs da Plataforma Google Maps
Usamos várias APIs da Plataforma Google Maps para acessar o mapa de base e os dados para criar essa experiência:
- Blocos fotorrealistas em 3D do Google Maps: modelos 3D de alta resolução de edifícios e terrenos oferecem uma representação realista e visualmente atraente de ambientes urbanos.
- API Places: o app pode identificar e mostrar informações detalhadas sobre pontos de interesse (PDIs) na área explorada, enriquecendo a experiência do usuário com conhecimento local.
- O preenchimento automático ajuda os usuários a pesquisar locais ou áreas de interesse específicos.
CesiumJS
O CesiumJS é responsável por renderizar e exibir o globo 3D de alta resolução. Ele processa o carregamento e a visualização dos blocos fotorrealistas em 3D do Google, que fornecem um modelo de malha 3D de edifícios e terrenos.
Gerenciamento de câmera: o CesiumJS oferece as ferramentas para controlar a posição, a orientação e o movimento da câmera. Isso inclui:
- Definir o ponto de vista inicial para focar no bairro especificado ao carregar o app.
- Implementar movimentos dinâmicos de câmera, como as animações de órbita automatizadas para exploração.
- Processamento de interações do usuário com o globo, se esses recursos estiverem incluídos (movimentação, zoom, rotação).
Saiba como o bloco fotorrealista em 3D pode funcionar com um renderizador de blocos em 3D.
Principais componentes
O aplicativo é dividido em dois apps diferentes:
- Aplicativo para o administrador
- App de demonstração
Este diagrama mostra uma visão geral das diferenças e da correlação entre os dois aplicativos:

Seria útil investigar cada app mais a fundo:
Aplicativo para o administrador
Esse aplicativo oferece uma interface fácil de usar que permite personalizar a experiência em 3D:
Pesquisa de local: use a barra de pesquisa integrada do Place Autocomplete da Plataforma Google Maps para encontrar a área que você quer mostrar. Depois de selecionar um local, a câmera vai se mover para essa área.
Câmera: ajuste a velocidade de movimento da câmera e o tipo de órbita para criar a experiência de visualização selecionada.
Lugares (PDIs): defina a densidade, o raio de pesquisa e os tipos de pontos de interesse (por exemplo, restaurantes, cafés, pontos turísticos) que você quer destacar.
Use este app para personalizar a experiência dos usuários finais.
Conheça o escritório do Google em Chicago seguindo um caminho de câmera lento.
Confira uma visualização densa de atrações turísticas ao redor da Las Vegas Strip.
Agora explore Las Vegas seguindo um caminho de câmera sinusoidal de alta velocidade
Conheça o Grand Canyon com todas as principais atrações turísticas
Há uma descrição detalhada de todas as personalizações do 3D Area Explorer.
App de demonstração
Esse é o aplicativo final, voltado ao usuário, que carrega a configuração que você criou no aplicativo para o administrador. Nesse ambiente 3D imersivo, os usuários poderão explorar as áreas selecionadas e descobrir os lugares que você destacou.
Depois de personalizar a aparência usando o aplicativo para o administrador, você pode fazer o download da configuração e executar o aplicativo personalizado no código-fonte.
Experiência do usuário

Alguns dos principais recursos do aplicativo são:
- Os usuários podem explorar uma área em 3D de forma interativa, incluindo edifícios, pontos de referência e terrenos.
- Os usuários podem pesquisar e descobrir lugares por perto (por exemplo, museus, parques, restaurantes).
Ao selecionar um lugar, os usuários podem ver informações detalhadas ou narrativas relacionadas a ele.
Os desenvolvedores podem personalizar a experiência de exploração usando configurações e controles (se usarem o aplicativo para o administrador).
A rotação automática está ativada, permitindo que a câmera gire automaticamente em torno do centro da área selecionada.
Pré-requisitos
Chave de API Google Maps: você vai precisar de uma chave de API válida com as seguintes APIs ativadas:
Servidor da Web: é possível disponibilizar o aplicativo de:
- Um servidor da Web local (por exemplo, usando Node.js, http-server)
- Um serviço de hospedagem na Web estático (o aplicativo vem com um Dockerfile)
Confira uma descrição detalhada das opções de implantação na seção do arquivo leia-me do projeto do GitHub.
Implantação
É possível implantar o app como um aplicativo de nó ou um contêiner do Docker em qualquer ambiente de contêiner, como o GKE ou o GAE. A demonstração hospedada usa a seguinte arquitetura:

- Nessa arquitetura, o código reside em um projeto do GitHub.
- O Cloud Build coleta o código em qualquer push para a ramificação principal e aciona uma operação de build.
- Como parte do build, ele injeta a chave de API e cria uma imagem que é armazenada no Artifact Registry.
- Por fim, ele implanta a imagem estável mais recente do Artifact Registry no Cloud Run.
- Também temos algumas verificações de integridade e monitoramento em execução para verificar a integridade dos apps implantados.
Informações de faturamento
A solução 3D Area Explorer usa os serviços da Plataforma Google Maps para oferecer uma experiência imersiva e dinâmica. Algumas APIs podem gerar cobranças. Confira uma visão geral das APIs e links para os preços.
Plataforma Google Maps – API 3D Tiles
A solução 3D Area Explorer usa a API 3D Tiles para melhorar a experiência visual com dados geoespaciais. Para detalhes de preços relacionados à API 3D Tiles, consulte a Plataforma Google Maps – Preços da API 3D Tiles.
Plataforma Google Maps – API Places
A API Places é usada para dados baseados em localização, adicionando informações detalhadas à experiência do 3D Area Explorer. Para entender os custos associados à API Google Places, acesse Plataforma Google Maps – Preços da API Places.
Plataforma Google Maps: API Autocomplete
O recurso de preenchimento automático melhora a interação do usuário. Para detalhes de preços sobre a API Google Maps Autocomplete, acesse Plataforma Google Maps – Preços do Place Autocomplete.
CesiumJS
O CesiumJS é usado para a visualização do globo em 3D. Embora o CesiumJS seja de código aberto, recursos ou serviços adicionais podem ter custos associados. Consulte a documentação do CesiumJS para ver as ofertas premium.
É fundamental analisar os detalhes de preços de cada API, já que as cobranças são determinadas individualmente com base no uso. A Plataforma Google Maps oferece um nível sem custo financeiro com uma determinada quantidade de uso, e os preços específicos podem variar de acordo com fatores como o número de solicitações e a região de uso.
Sempre consulte as páginas oficiais de preços para ver as informações mais precisas e atualizadas sobre os custos de uso da Plataforma Google Maps e do CesiumJS. Garanta a conformidade com os termos e condições descritos por esses serviços para gerenciar e entender as despesas associadas de maneira eficaz.
Conclusão
Este documento apresenta uma visão geral dos recursos, componentes, experiência do usuário e requisitos técnicos do 3D Area Explorer.
Com os blocos fotorrealistas em 3D do Google e a API Places, é possível explorar bairros virtualmente, descobrir pontos de interesse e aprender mais sobre a história local.
Seja para mostrar uma área, melhorar a exploração ou promover o storytelling digital, o Explorador de Áreas 3D oferece uma plataforma visualmente impressionante.
Teste a demonstração e personalize-a usando o aplicativo para o administrador para criar uma experiência 3D envolvente e informativa.