Iniciar sesión

NextGIS Frontend 4.0, menos código de integración, más posibilidades para mapas web

23/09/2026 · Eduard Kazakov, Claudio Matko

Una gran actualización del conjunto de bibliotecas JS para desarrollar aplicaciones web cartográficas

Ya está disponible la versión 4.0 de NextGIS Frontend, un conjunto de bibliotecas JavaScript para desarrollar rápidamente tus propias aplicaciones web cartográficas basadas en NextGIS Web.

En la versión 4 se actualizó la compatibilidad con la API de NextGIS Web y se mejoró el funcionamiento uniforme con Leaflet, OpenLayers y MapLibre GL JS, incluso en aplicaciones React. Aparecieron nuevas bibliotecas para trabajar con QuickMapServices. Los ejemplos y la documentación se actualizaron sustancialmente según los estándares modernos de desarrollo web.

Compatibilidad con la API actual de NextGIS Web

NextGIS Frontend 4 admite nuevas expresiones de filtrado de capas vectoriales y ráster, campos booleanos y estados de grupos de capas del mapa web. Gracias a esto, las aplicaciones tienen en cuenta con mayor precisión la estructura y la configuración de un proyecto preparado en NextGIS Web.

Uno de los escenarios principales de NextGIS Frontend sigue siendo muy simple: los datos y la estructura del proyecto se almacenan en NextGIS Web, y la aplicación personalizada los obtiene a través de la API.

Por ejemplo, en NextGIS Web están las capas y el mapa web, y en una aplicación aparte, con las bibliotecas de NextGIS Frontend, se implementan un geoportal, una interfaz de operador, un área de cliente o parte de otro sistema de información.

Gracias a NextGIS Frontend no necesitas reinventar los mecanismos de interacción con el SIG web. Según la tarea, puedes trabajar en distintos niveles:

NextGIS Frontend sirve tanto para lanzar rápidamente una interfaz simple sobre un mapa web como para desarrollar una aplicación especializada compleja a partir de partes individuales de las bibliotecas.

Muchos escenarios típicos ya están explicados en los ejemplos de NextGIS Frontend. No son solo una demostración de posibilidades, sino también fragmentos de código listos para usar en tus proyectos. Puedes ver el filtrado en acción en el ejemplo de filtrado por propiedades de capa, y el trabajo con mapas web, en el ejemplo de NGW web map.

Filtrar, seleccionar y mostrar objetos ahora es más fácil

NextGIS Frontend nació de muchos años de experiencia en el desarrollo de aplicaciones web cartográficas. En la mayoría de ellas se necesitan una y otra vez las mismas operaciones básicas:

En la versión 4 se prestó especial atención a estos escenarios. Se mejoraron el filtrado dinámico, la selección y deselección de objetos, el manejo de eventos, los popups y la visualización de los objetos seleccionados.

Como resultado, las acciones típicas con datos requieren menos código especial y se reutilizan más fácilmente en distintas aplicaciones.

Mejor interacción entre distintos frameworks cartográficos

NextGIS Frontend permite usar un enfoque unificado para trabajar con el mapa en distintos motores cartográficos. En la versión 4 esta universalidad es aún más completa: se mejoraron la selección y el resaltado de objetos, el filtrado, los popups, el zoom y los controles del mapa.

¿Por qué se necesita un comportamiento idéntico?

NextGIS Frontend admite tres frameworks cartográficos distintos: Leaflet, OpenLayers y MapLibre GL JS, no para cambiar entre ellos dentro de una misma aplicación, sino, para separar una parte significativa de la lógica mediante una API común y elegir el motor según los requisitos del proyecto. Además, donde se necesiten capacidades específicas del motor, la aplicación todavía puede trabajar con él directamente.

Cada opción tiene sus puntos fuertes. Leaflet es ideal para interfaces simples y livianas. OpenLayers es adecuado para resolver escenarios GIS de ingeniería más exigentes. MapLibre GL JS es el que mejor maneja renderizado WebGL, teselas vectoriales, estilización flexible y visualización moderna, incluido 3D.

Por eso, elige el motor cartográfico según los requisitos de tu tarea: no tendrás que volver a implementar la integración con NextGIS Web. Los mecanismos principales de interacción con el Web GIS ya están implementados y probados en las bibliotecas de NextGIS Frontend.

En los ejemplos siguientes se ve bien cómo las mismas tareas se resuelven con distintos frameworks cartográficos:

imagen
imagen
imagen
imagen

Controles comunes

Antes, cada adaptador cartográfico usaba su propio enfoque para los controles: botones, interruptores y paneles. Esto complicaba el desarrollo y la evolución de las interfaces.

En NextGIS Frontend 4 apareció un enfoque común: ahora los paneles de control se pueden armar de la misma manera independientemente del motor cartográfico elegido. Los elementos se pueden agrupar, agregar conmutadores de grupo, cambiar la orientación de los paneles y configurar su ubicación.

Un buen ejemplo sobre el tema: Contenedores de controles personalizados

Mejor integración con React

En la nueva versión, los componentes React evolucionan junto con la arquitectura general de NextGIS Frontend: usan controles universales y un enfoque unificado para trabajar con el mapa.

Esto te permite concentrarte en la lógica de la propia aplicación web y dejar en las bibliotecas la interacción de bajo nivel con NextGIS Web y las particularidades del motor cartográfico concreto.

QuickMapServices ahora es más fácil de integrar en tu mapa

En la versión 4, la integración con QuickMapServices se separó en paquetes independientes para Leaflet, OpenLayers y MapLibre GL JS. Además de agregar la capa base por código, se agregó un control práctico para ver el catálogo y buscar servicios QMS desde la web.

imagen

Esto es útil en GIS aplicados, donde el usuario necesita elegir una base cartográfica adecuada sin recurrir cada vez al desarrollador. Además, las bibliotecas QMS se pueden usar en cualquier proyecto, no solo en aplicaciones con NextGIS Web.

Los ejemplos ahora están más cerca de un proyecto real

Se hicieron muchas mejoras en el sitio de ejemplos code.nextgis.com.

Ahora el ejemplo no solo se puede ver en el navegador, sino también usar como punto de partida listo para tu propia aplicación. Para cada ejemplo hay versiones en JavaScript y TypeScript, así es más fácil elegir la opción adecuada y llevar el código a tu proyecto.

El propio sitio de demostración code.nextgis.com ahora admite tema oscuro (se adapta al sistema), y se mejoraron la navegación y la presentación de los ejemplos. En la referencia de API se agregó una descripción de la arquitectura de paquetes, además de documentación amigable para LLM: el índice llms.txt, cómodo para dárselo a herramientas de IA como Claude Code, Cursor o Antigravity al trabajar con código basado en NextGIS Frontend.

Enlaces relacionados:

Para desarrolladores

Uno de los principales cambios técnicos de la versión 4 es el tipado de las consultas a la API de una instancia concreta de NextGIS Web.

Para NgwConnector.route(), las declaraciones TypeScript se pueden generar directamente desde el servidor que uses:

npx @nextgis/ngw-types-loader

Como resultado, los tipos corresponden a los componentes y rutas de API que realmente están disponibles en tu instancia de NextGIS Web.

Al actualizar proyectos existentes, presta atención a los cambios en propertiesFilter, la compatibilidad con MapLibre GL JS 6 y el nuevo enfoque común para los controles.

La lista completa de cambios técnicos está en el CHANGELOG en GitHub. El código fuente y la documentación de las bibliotecas se pueden encontrar en el repositorio, y los ejemplos en code.nextgis.com.

Si ya estás desarrollando una aplicación basada en NextGIS Frontend, actualízate a la versión 4. Y si recién empiezas, toma los ejemplos listos como base y arma interfaces para tus tareas.