Bibliotecas de código abierto

Hay muchas bibliotecas de código abierto disponibles que brindan funcionalidades 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 IUs 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

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

npm i @googlemaps/react-wrapper

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 los tipos de unión estrecha.

npm i -D @googlemaps/typescript-guards

Cómo extender marcadores y superposiciones

Las siguientes bibliotecas extienden clases como Marker y OverlayView.

Crea y administra clústeres a 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 a fin de 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

Crea simulaciones que 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