Migrar angular-google-maps / ngMap a Angular moderno
angular-google-maps (las directivas ui-gmap) y ngMap exponían la API de JavaScript de Google Maps como directivas de AngularJS para mapas, marcadores y ventanas. Ambas están atadas a AngularJS.
Qué la reemplaza
| Opción | Cuándo elegirla |
|---|---|
| @angular/google-maps | Componentes oficiales del equipo de Angular: mapa, marcadores, ventanas de información, figuras y capas. |
| Google Maps JavaScript API directly | Cuando usas funciones de la API que los componentes no cubren; crea el mapa dentro de un componente propio. |
| Leaflet or MapLibre GL | Cuando además quieres salir de la plataforma de Google Maps. |
Cómo migrarla
- Inventaría las funciones de mapa en uso: marcadores, clustering, ventanas de información, dibujo, autocompletado de lugares, rutas.
- Carga la API de JavaScript de Maps una sola vez con tu clave y construye un componente de mapa compartido con google-map y sus componentes hijos.
- Lleva la lógica de marcadores y eventos desde atributos de directiva a inputs y outputs del componente, y prueba con una cantidad realista de marcadores.
Cuidado con. Google marcó como obsoleto el Marker clásico en favor de los marcadores avanzados, que exigen un map ID. Decide cuál vas a usar antes de migrar todos los marcadores.
Otras librerías
¿Planeas una migración o una plataforma de microfrontends?
En una llamada de 20 minutos me cuentas tu situación y te digo cómo la abordaría. Si todavía no vale la pena, también te lo digo.
Escríbeme por LinkedIn