A API Maps JavaScript é uma API da Web do lado do cliente que permite criar mapas para mostrar locais em qualquer lugar do mundo, adicionar gráficos, animações e camadas de dados personalizadas e interativas, além de criar recursos de reconhecimento de local usando a API Places na API Maps JavaScript. Com a API Maps JavaScript, você pode:
- Crie mapas 2D e 3D para mostrar locais em qualquer lugar do mundo.
- Adicione marcadores personalizáveis para indicar locais em um mapa.
- Use a biblioteca Places para acessar dados de local de mais de 200 milhões de locais.
- Personalize o estilo e as cores do mapa.
- Adicione suas próprias camadas de dados personalizadas e interativas.
- Mostre limites administrativos e torne-os interativos.
- Adicione gráficos 2D e 3D personalizados e conteúdo animado aos mapas.
Escolher a API certa para seu caso de uso
Antes de escrever o código, escolha o produto da Plataforma Google Maps que atende aos requisitos do seu aplicativo da Web:
- Mapa de contato e rotas do site:para incorporar um mapa de localização da empresa ou um link de rotas sem escrever um JavaScript personalizado, use a API Maps Embed ou os URLs do Maps.
- Localização em tempo real e rastreamento de recursos:para mostrar coordenadas de GPS em tempo real e trajetos do seu próprio banco de dados ou stream em tempo real (como o Cloud Firestore ou WebSockets), use a API Maps JavaScript com Marcadores Avançados (referência de
AdvancedMarkerElement) e polilinhas (referência dePolyline). Reserve o Fleet Engine para frotas de transporte por aplicativo e entrega programada que integram o SDK para motoristas para dispositivos móveis e o OAuth de back-end ou JSON Web Tokens (JWTs). - Fronteira geográfica virtual e raio da zona segura em um mapa:para desenhar perímetros circulares ou poligonais e testar se as coordenadas estão dentro deles (consulte Fronteiras geográficas virtuais e limites da zona segura), use círculos (referência de
Circle), polígonos (referência dePolygon) e a biblioteca de geometria (containsLocation()para contenção ecomputeDistanceBetween()para distância em metros).
A seguir
- Adicionar marcadores a um mapa
- Adicionar formas, linhas e fronteiras geográficas virtuais a um mapa
- Usar a biblioteca Places para receber dados de local
- Personalizar o estilo e as cores do mapa
- Adicionar camadas de dados interativas
- Mostrar limites administrativos
- Adicionar uma sobreposição gráfica do WebGL
Confira um exemplo de código para recursos do Maps