Personalizar el mapa - IGN-CNIG/API-CNIG GitHub Wiki

La personalización del mapa que queremos construir recae en las siguientes categorías:

• Capas: Son los datos a mostrar y conforman el mapa que se representará. Actualmente, la API-CNIG acepta los principales orígenes de datos OGC.
• Controles: Son las herramientas que incluye el mapa y que permiten trabajar con él, tales como herramientas de medición, de coordenadas, etc. Se dividen en dos categorías: controles básicos y plugins.
• Opciones: Permiten establecer características concretas del mapa o del área a visualizar, como son el centrado en un punto, nivel de zool inicial, sistema de referencia, etc.
• Internacionalización: Permiten establecer un idioma concreto al mapa, controles y plugins. Más información.
  • M.language.getTranslation([nombre_idioma]): Retorna un JSON con todas las traducciones.
  • M.plugin.[nombre_plugin].getJSONTranslations([nombre_idioma]): Retorna un JSON con las traducciones de un plugin.
  • M.language.addTranslation([nombre_idioma]): Permite establecer un idioma concretro al mapa, se tiene que declarar antes que M.map.
  • M.language.getLang(): Devuelve el idioma actual.
  • M.language.setLang(): Modifica el idioma.

M.language.addTranslation('ca', {
    "scale": {
        "title": "Escala",
        "scale": "Escala",
        "level": "Nivel"
    },
    "attributions": {
        "exception": {
            "impl": "La implementació no pot crear controls de Attribution.",
            "mode": "L'opció 'mode' no s'ha establert correctament. Consell: {mode: 1 | 2 | 3}.",
            "type": "L'opció 'type' no ha estat establerta. Quan l'opció 'url' és usada el plugin necessita l'opció 'type'. Valors = geojson | kml | topojson.",
            "layer_name": "L'opció 'layerName' no s'ha establert. Quan l'opció 'url' s'utilitza el connector necessita l'opció 'layerName'."
        },
        "attribution": "atribució",
        "tooltip": "Reconeixements"
    }
});

M.language.setLang('ca');

const mapa = new M.map({
    container: 'map',
    bbox: [-1715858.410945638, 4318997.846225591, 632287.0979749766, 4797187.895177655],
    controls: ['scale*true'],
});

• Configuration: Por defecto la API-CNIG proporciona unas configuraciones por defecto: configuration.js

Para modificar esta configuración se tiene que hacer antes de crear el mapa "M.map". Por ejemplo:

M.config('tms', {
  base: 'TMS*PNOA-MA*https://tms-pnoa-ma.idee.es/1.0.0/pnoa-ma/{z}/{x}/{-y}.jpeg*true*false*19',
});

const map = M.map({
  container: 'mapjs',
  controls: ['scale'],
  zoom: 6,
  bbox: [-3132050.401125163, 3036505.360983581, 983484.0466877755, 5563700.732843714],
});

Ejemplos

Configuración de visualizador: https://componentes.cnig.es/GaleriaEjemplos_APICNIG/ejemplos/configuracionVisualizador01.html
Configuración de idioma a través de una extensión personalizada:
https://componentes.cnig.es/GaleriaEjemplos_APICNIG/ejemplos/cambioIdioma01.html
Extensión fuentes de datos: https://componentes.cnig.es/GaleriaEjemplos_APICNIG/ejemplos/attributions01.html