Bibliotecas de código abierto

Hay muchas bibliotecas de código abierto disponibles que brindan capabilities adicionales para la API de Maps JavaScript. Estas bibliotecas tienen control de versiones en GitHub y se publican en NPM.

Componentes web

Usa los componentes web de la API de Maps JavaScript para agregar rápidamente la funcionalidad de Maps a tus sitios web. Los componentes web encapsulan el código estándar, las prácticas recomendadas y el diseño responsivo, lo que reduce las IU de mapas complejas a lo que es, de hecho, un solo elemento HTML.

La biblioteca de componentes extendidos de Google Maps Platform es un conjunto de componentes web que ayuda a los desarrolladores a crear mejores mapas más rápido y con menos esfuerzo.

npm i @googlemaps/extended-component-library

Cómo cargar la API

Las aplicaciones web modernas pueden aprovechar las siguientes bibliotecas para cargar la API de Maps JavaScript.

Carga la API de Maps JavaScript de forma dinámica con Promesas.

npm i @googlemaps/js-api-loader

Cómo utilizar TypeScript

Los usuarios de TypeScript pueden comenzar a utilizar los siguientes paquetes. Para obtener más información, consulta la guía de uso de TypeScript.

Tipos de TypeScript para la API de Maps JavaScript.

npm i -D @types/google.maps

Protectores de TypeScript para reducir los tipos de unión.

npm i -D @googlemaps/typescript-guards

Uso de React

Los usuarios de React pueden comenzar con los siguientes paquetes.

Componentes y hooks para integrar la API de Maps JavaScript en las aplicaciones de React.

npm i -D @vis.gl/react-google-maps

Componente wrapper que permite cargar de forma declarativa la API de Maps JavaScript.

npm i @googlemaps/react-wrapper

Cómo extender marcadores y superposiciones

Las siguientes bibliotecas extienden clases como Marker y OverlayView.

Crea y administra clústeres por nivel de zoom para grandes cantidades de marcadores.

npm i @googlemaps/markerclusterer

Agrega y quita marcadores según los cambios en el viewport del mapa.

npm i @googlemaps/markermanager

Agrega capas de Open Geospatial Consortium (OGC), como el servicio de mapas web (WMS), a un mapa.

npm i @googlemaps/ogc

Agrega etiquetas HTML personalizadas a los marcadores.

npm i @googlemaps/markerwithlabel

Usa WebGL y ThreeJS para realizar visualizaciones de alto rendimiento.

npm i @googlemaps/three

Utiliza Deck.gl como una superposición de Google Maps personalizada.

npm i @deck.gl/google-maps

Pruebas y análisis con lint

Usa estas bibliotecas para garantizar que se sigan las prácticas recomendadas y facilitar las pruebas para la API de Maps JavaScript.

Usa reglas de ESLint personalizadas para analizar tu código con lint.

npm i -D eslint-plugin-googlemaps

Simulaciones para usar con la biblioteca de pruebas Jest.

npm i -D @googlemaps/jest-mocks

Bibliotecas de Node.js

Permite realizar llamadas desde Cloud Functions o el código del servidor.

npm i @googlemaps/google-maps-services-js

Codifica y decodifica polilíneas en Node.js.

npm i @googlemaps/polyline-codec

Firma las URLs en Node.js para brindar mayor seguridad.

npm i @googlemaps/url-signature