Guía para el desarrollo de API IDEE

La API-IDEE proporciona una librería, creada con JavaScript, para facilitar la creación de visores de mapas. Esto se encuentra en el componente api-idee-js, para la construcción de este módulo se ha utilizado OpenLayers como librería base y una arquitectura de "facade" e "implementation".

OpenLayers es una librería de JavaScript que se utiliza para crear mapas interactivos en aplicaciones web. Es una herramienta poderosa para mostrar datos geográficos en aplicaciones web, ya sea para visualizar ubicaciones, rutas o cualquier otra información relacionada con mapas. Es gratuita y de código abierto.

Estructura del componente

/
├── config 📋                # Configuración del JSDOC.
├── src 📁                   # Código fuente.
    ├── facade           # Fachada.
    ├── impl             # Implementación.
    ├── plugins          # Plugins.
    ├── templates        # Plantillas handlebars para los controles y la librería.
    ├── configuration.js # Configuraciones predeterminadas de la librería.
├── task 🌈                  # Crea el punto de entrada, index.js
├── test 📦                  # Código test.
├── versions 💾              # Control de versiones.
├── webpack-config 🏗️        # Configuración de Webpack.
└── ...

• facade: Contiene una fachada común a todas las implementaciones.

  • Map.js: Contiene la clase "Map" (IDEE.map), para la construcción del mapa.
  • layer: Contiene todos los tipos de capas.
  • i18: Traducciones.
  • style: Contiene los archivos necesarios para gestionar la simbología.

• impl: Contiene las implementaciones. Actualmente, en el caso de este componente se está utilizando únicamente OpenLayers (ol), pero se podría ampliar a otras librerías base.

• plugins: Los plugins o componentes son funcionalidades que ofrecen utilidades específicas que, a diferencia de los controles básicos, suelen usarse en escenarios concretos, por lo que se separan del core o núcleo principal de la API para no penalizar con su descarga a quien no los necesite. Algunos ejemplos son el plugin de búsquedas del IGN o el plugin de atribuciones.

• templates: En esta carpeta se encuentran las diferentes plantillas para los controles, popup, toasts, diálogos... Utiliza la librería Handlebars, una biblioteca de plantillas de JavaScript que permite generar HTML dinámico de manera eficiente y sencilla.
  Con Handlebars, los desarrolladores pueden crear plantillas HTML con marcadores de posición, llamados "tags", que luego se pueden llenar con datos dinámicos en tiempo de ejecución. Estos "tags" son reconocibles por las llaves dobles {{}} y pueden contener variables, expresiones y constructores de control, lo que brinda gran flexibilidad.

• configuration.js: En este archivo se encuentran las configuraciones básicas por defecto de la librería, se pueden modificar con el método IDEE.config().

Entorno de desarrollo

Este entorno se genera mediante webpack, compila la API-IDEE y proporciona un entorno de desarrollo. Para realizar pruebas en el entorno de desarrollo dentro de la API-IDEE se tiene que ejecutar el comando npm start -- --name=[Nombre del test], los test se encuentran en la carpeta test/development.