1. Inicio
  2. Espacios de nombres
  3. SITNA.layer

layer

Descripción

Espacio de nombres de las capas del mapa.

Clases

new <abstract> Layer( [ options ] )

new Raster( [ options ] )

new Vector( [ options ] )

Definiciones de tipos

ClusterOptions

Descripción

Opciones de clustering de puntos de una capa, define si los puntos se tienen que agrupar cuando están más cerca entre sí que un valor umbral.

Hay que tener en cuenta que el archivo config.json de una maquetación puede sobreescribir los valores por defecto de esta propiedad (para ver instrucciones de uso de maquetaciones, consultar Configurar por maquetación).

Propiedades
Nombre Tipo Atributos Descripción
distance number

Distancia en píxels que tienen que tener como máximo los puntos entre sí para que se agrupen en un cluster.
animate boolean <optional>

Si se establece a true, los puntos se agrupan y desagrupan con una transición animada.
styles SITNA.layer.ClusterStyleOptions <optional>

Opciones de estilo de los clusters.
Ejemplos

Ver en vivo


<div id="mapa"></div>
<script>
    // Creamos un mapa con una capa de puntos de un KML,
    // clustering activado a 50 pixels y transiciones animadas.
    var map = new SITNA.Map("mapa", {
        workLayers: [
            {
                id: "cluster",
                type: SITNA.Consts.layerType.KML,
                url: "data/PromocionesViviendas.kml",
                title: "Clusters",
                cluster: {
                    distance: 50,
                    animate: true
                }
            }
        ]
    });
</script>
Detalles

SITNA.layer.VectorOptions

ClusterStyleOptions

Descripción

Opciones de estilo de cluster de puntos. Hay que tener en cuenta que el archivo config.json de una maquetación puede sobreescribir los valores por defecto de esta propiedad (para ver instrucciones de uso de maquetaciones, consultar Configurar por maquetación).

Propiedades
Nombre Tipo Atributos Descripción
point SITNA.feature.PointStyleOptions <optional>

Opciones de estilo del punto que representa el cluster.
Ejemplos

Ver en vivo


<div id="mapa"></div>
<script>
    // Creamos un mapa con una capa vectorial,
    // clustering activado a 50 pixels y estilos personalizados.
    var map = new SITNA.Map("mapa", {
        workLayers: [
            {
                id: "cluster",
                type: SITNA.Consts.layerType.VECTOR,
                title: "Clusters",
                styles: {
                    point: {
                        strokeColor: "#0000ff",
                        strokeWidth: 2,
                        fillColor: "#0000ff",
                        fillOpacity: 0.2,
                        radius: 6
                    }
                },
                cluster: {
                    distance: 50,
                    styles: {
                        point: {
                            fillColor: "#f90",
                            fillOpacity: 1,
                            strokeColor: "#c60",
                            strokeWidth: 2,
                            fontColor: "#f90"
                        }
                    }
                }
            }
        ]
    });

    map.loaded(function () {
        // Añadimos puntos aleatorios
        var extent = SITNA.Cfg.initialExtent;
        var dx = extent[2] - extent[0];
        var dy = extent[3] - extent[1];

        var randomPoint = function () {
            var x = extent[0] + Math.random() * dx;
            var y = extent[1] + Math.random() * dy;
            return [x, y];
        }

        for (var i = 0; i < 200; i++) {
            var point = randomPoint();
            map.addMarker(point, {
                layer: "cluster",
                data: {
                    x: point[0],
                    y: point[1]
                }
            });
        }
    });
</script>
Detalles

HeatmapStyleOptions

Descripción

Opciones de estilo de mapa de calor. Hay que tener en cuenta que el archivo config.json de una maquetación puede sobreescribir los valores por defecto de esta propiedad (para ver instrucciones de uso de maquetaciones, consultar Configurar por maquetación).

Propiedades
Nombre Tipo Atributos Valor por defecto Descripción
blur number <optional>
 15

Ancho en píxeles del difuminado de las manchas del mapa de calor.
gradient Array.<string> <optional>
 ["#00f", "#0ff", "#0f0", "#ff0", "#f00"]

Gradiente de colores de las manchas de mapa de calor. Debe ser un array de cadenas CSS de color.
radius number <optional>
 8

Radio en píxeles de la mancha unitaria en el mapa de calor.
Ejemplos

Ver en vivo


<div id="mapa"></div>
<script>
    // Crear un mapa con una capa vectorial, mapa de calor activado con un radio de 32 píxeles,
    // un difuminado de 16 píxeles y un gradiente de colores azul-rojo-dorado.
    var map = new SITNA.Map("mapa", {
        workLayers: [
            {
                id: "heatmap",
                type: SITNA.Consts.layerType.VECTOR,
                title: "Mapa de calor",
                heatmap: {
                    radius: 16,
                    blur: 32,
                    gradient: [
                        "#00008b",
                        "#dc143c",
                        "#ffd700"
                    ]
                }
            }
        ]
    });

    map.loaded(function () {
        // Añadimos puntos aleatorios
        var extent = SITNA.Cfg.initialExtent;
        var dx = extent[2] - extent[0];
        var dy = extent[3] - extent[1];

        var randomPoint = function () {
            var x = extent[0] + Math.random() * dx;
            var y = extent[1] + Math.random() * dy;
            return [x, y];
        }

        for (var i = 0; i < 200; i++) {
            var point = randomPoint();
            map.addMarker(point, {
                layer: "heatmap",
                data: {
                    x: point[0],
                    y: point[1]
                }
            });
        }
    });
</script>
Detalles

LayerOptions

Descripción

Opciones de capa. Este objeto se utiliza al configurar un mapa, el control del catálogo de capas o como parámetro al añadir una capa.

Propiedades
Nombre Tipo Atributos Descripción
id string

Identificador único de capa. No puede haber en un mapa dos capas con el mismo valor de id.
format string <optional>

En las capas de tipo WMS y WMTS, es el tipo MIME del formato de archivo de imagen a obtener del servicio. En las capas de tipo VECTOR, es el tipo MIME del formato de archivo de datos geográficos que queremos cargar (GeoJSON, KML, etc.).

Si esta propiedad no está definida, si la capa es un mapa de fondo (consultar propiedad isBase), se asume que el formato es image/jpeg, en caso contrario se asume que el formato es image/png.

Para asignar valor a esta propiedad se puede usar las constantes de definidas en SITNA.Consts.mimeType.
hideTree boolean <optional>

Aplicable a capas de tipo WMS y KML. Si se establece a true, la capa no muestra la jerarquía de grupos de capas en la tabla de contenidos ni en la leyenda.
isBase boolean <optional>

Si se establece a true, la capa es un mapa de fondo.
isDefault boolean <optional>

Obsoleta: En lugar de esta propiedad es recomendable usar la propiedad defaultBaseLayerde SITNA.MapOptions.

Si se establece a true, la capa se muestra por defecto si forma parte de los mapas de fondo.
overviewMapLayer SITNA.layer.LayerOptions | string <optional>

Definición de la capa que se utilizará como fondo en el control de mapa de situación cuando esta capa está de fondo en el mapa principal. Si el valor es de tipo string, tiene que ser un identificador de capas de la API SITNA (un miembro de SITNA.Consts.layer).

La capa del mapa de situación debe ser compatible con el sistema de referencia de coordenadas del mapa principal (ver propiedad crs de SITNA.MapOptions).
stealth boolean <optional>

Si se establece a true, la capa no aparece en la tabla de contenidos ni en la leyenda. De este modo se puede añadir una superposición de capas de trabajo que el usuario la perciba como parte del mapa de fondo.
thumbnail string <optional>

URL de una imagen en miniatura a mostrar en el selector de mapas de fondo.
title string <optional>

Título de capa. Este valor se mostrará en la tabla de contenidos y la leyenda.
type string <optional>

Tipo de capa. Si no se especifica se considera que la capa es WMS. La lista de valores posibles está definida en SITNA.Consts.layerType.
url string <optional>

URL del servicio OGC o del archivo de datos geográficos que define la capa. Propiedad obligatoria en capas de tipo WMS, WMTS, WFS y KML.

En las capas de tipo VECTOR los archivos de datos geográficos soportados son KML, GeoJSON, GPX, GML, WKT y TopoJSON. El formato se deduce de la extensión del nombre de archivo, pero también se puede especificar utilizando la propiedad format.

En el caso de que un fichero KML tenga definido el estilo del bocadillo, este formato será usado al renderizar el bocadillo en visores basados en la API SITNA.
Ejemplos

Ejemplo de uso de la propiedad urlVer en vivo


<div id="mapa"></div>
<script>
    // Establecemos un layout simplificado apto para hacer demostraciones de controles.
    SITNA.Cfg.layout = "layout/ctl-container";
    // Añadimos el control de tabla de contenidos en la primera posición.
    SITNA.Cfg.controls.TOC = {
        div: "slot1"
    };
    // Añadimos una capa raster desde un servicio WMS y cuatro capas vectoriales
    // a partir de archivos geográficos: GeoJSON, GPX, KML y GML.
    SITNA.Cfg.workLayers = [
        {
            id: "wms",
            title: "Camino de Santiago",
            type: SITNA.Consts.layerType.WMS,
            url: "//idena.navarra.es/ogc/wms",
            layerNames: "IDENA:PATRIM_Lin_CaminoSantR",
            format: SITNA.Consts.mimeType.PNG
        },
        {
            id: "geojson",
            type: SITNA.Consts.layerType.VECTOR,
            url: "data/PARQUESNATURALES.json",
            format: SITNA.Consts.mimeType.GEOJSON
        },
        {
            id: "gpx",
            type: SITNA.Consts.layerType.VECTOR,
            url: "data/CAMINOFRANCES.gpx"
        },
        {
            id: "kml",
            type: SITNA.Consts.layerType.VECTOR,
            url: "data/MUSEOSNAVARRA.kml"
        },
        {
            id: "gml",
            type: SITNA.Consts.layerType.VECTOR,
            url: "data/ESTACIONESTREN.gml"
        },
    ];
    var map = new SITNA.Map("mapa");
</script>

Ejemplo de uso de la propiedad overviewMapLayerVer en vivo


<div id="mapa"></div>
<script>
    // Añadimos una capas de fondo con capas asociadas para el mapa de situación
    SITNA.Cfg.baseLayers = [
        {
            id: "hybrid",
            title: "Mapa base/ortofoto",
            type: SITNA.Consts.layerType.WMS,
            url: "//idena.navarra.es/ogc/wms",
            layerNames: "mapaBase_orto",
            thumbnail: "//idena.navarra.es/navegar/api/TC/css/img/thumb-base_ortho.png",
            overviewMapLayer: {
                id: "hybrid_ov",
                type: SITNA.Consts.layerType.WMS,
                url: "//www.ign.es/wms-inspire/ign-base",
                layerNames: "IGNBaseTodo-gris"
            }
        },
        {
            id: "mapbox",
            title: "Mapbox Streets",
            type: SITNA.Consts.layerType.WMTS,
            encoding: SITNA.Consts.WMTSEncoding.RESTFUL,
            url: "//idena.navarra.es/navegar/api/wmts/mapbox/",
            format: SITNA.Consts.mimeType.PNG,
            layerNames: "streets",
            matrixSet: "WorldWebMercatorQuad",
            thumbnail: "//idena.navarra.es/navegar/api/TC/css/img/thumb-mapbox-streets.png",
            overviewMapLayer: SITNA.Consts.layer.CARTO_DARK
        }
    ];
    var map = new SITNA.Map("mapa");
</script>
Detalles

RasterOptions

Descripción

Opciones de capa raster. Este objeto se utiliza al configurar un mapa, el control del catálogo de capas o como parámetro al añadir una capa.

Propiedades
Nombre Tipo Atributos Valor por defecto Descripción
id string

Identificador único de capa. No puede haber en un mapa dos capas con el mismo valor de id.
layerNames string

Lista separada por comas de los nombres de capa del servicio OGC.
url string

URL del servicio OGC que define la capa.
filter string | SITNA.filter.Filter <optional>

Filtro en formato SITNA.filter, GML o CQL. En función del formato especificado, se añade a las peticiones GetMap posteriores el parámetro filter o cql_filter correspondiente.

No se pueden añadir al mapa 2 o más capas del mismo servicio (misma URL), en las cuales se establezcan filtros de tipo distinto. Es decir, no se pueden mezclar filtros CQL y GML o CQL y SITNA.filter en capas del mismo servicio.
format string <optional>

Tipo MIME del formato de archivo de imagen a obtener del servicio.

Si esta propiedad no está definida, entonces si la capa es un mapa de fondo (consultar propiedad isBase), se asume que el formato es image/jpeg, en caso contrario se asume que el formato es image/png.

Para asignar valor a esta propiedad se puede usar las constantes de definidas en SITNA.Consts.mimeType.
hideTree boolean <optional>

Aplicable a capas de tipo WMS. Si se establece a true, la capa no muestra la jerarquía de grupos de capas en la tabla de contenidos ni en la leyenda.
isBase boolean <optional>

Si se establece a true, la capa es un mapa de fondo.
isDefault boolean <optional>

Obsoleta: En lugar de esta propiedad es recomendable usar la propiedad defaultBaseLayerde SITNA.MapOptions.

Si se establece a true, la capa se muestra por defecto si forma parte de los mapas de fondo.
matrixSet string <optional>

Nombre de conjunto de matrices del servicio WMTS. Esta propiedad es obligatoria para capas de tipo WMTS.
overviewMapLayer SITNA.layer.LayerOptions | string <optional>

Definición de la capa que se utilizará como fondo en el control de mapa de situación cuando esta capa está de fondo en el mapa principal.
thumbnail string <optional>

URL de una imagen en miniatura a mostrar en el selector de mapas de fondo.
title string <optional>

Título de capa. Este valor se mostrará en la tabla de contenidos y la leyenda.
transparent boolean <optional>
 true

Indica si la capa tiene transparencia.
type string <optional>

Tipo de capa. Si no se especifica se considera que la capa es WMS. La lista de valores posibles está definida en SITNA.Consts.layerType.
Ejemplos

Ejemplo de uso de la propiedad filter Ver en vivo


<div id="mapa"></div>
<script>
   // Establecemos un layout simplificado apto para hacer demostraciones de controles.
   SITNA.Cfg.layout = "layout/ctl-container";
   // Añadimos el control de tabla de contenidos en la primera posición.
   SITNA.Cfg.controls.TOC = {
       div: "slot1"
   };
   var map = new SITNA.Map("mapa", {
       // Mapa centrado de Pamplona
       initialExtent: [606239, 4738249, 614387, 4744409],
       // Añadimos la capa de GeoPamplona del catálogo de edificios filtrada para mostrar solamente los de uso cultural.
       // Añadimos también la capa de IDENA de museos filtrada para mostrar solamente los que están en Pamplona.
       // Añadimos también la capa de IDENA de edificios religiosos filtrando por los contenidos en un polígono dado.
       workLayers: [
           {
               id: "layer1",
               title: "Catálogo de edificios de Pamplona de uso cultural",
               type: SITNA.Consts.layerType.WMS,
               url: "//sig.pamplona.es/ogc/wms",
               layerNames: "PROY_Pol_Edificios",
               filter: '<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc"><ogc:PropertyIsEqualTo><ogc:PropertyName>GRUPOEDIF</ogc:PropertyName><ogc:Literal><![CDATA[CULTURAL]]></ogc:Literal></ogc:PropertyIsEqualTo></ogc:Filter>'
           },
           {
               id: "layer2",
               title: "Museos localizados en Pamplona",
               type: SITNA.Consts.layerType.WMS,
               url: "//idena.navarra.es/ogc/ows",
               layerNames: "DOTACI_Sym_Museos",
               filter: "POBLACION='Pamplona / Iruña'"
           },
           {
               id: "layer3",
               title: "Edificios religiosos",
               type: SITNA.Consts.layerType.WMS,
               url: "//idena.navarra.es/ogc/ows",
               layerNames: "DOTACI_Sym_EdifReligi",
               filter: SITNA.filter.within("the_geom",new SITNA.feature.Polygon([
                     [602979, 4743332],
                     [602979, 4737828,
                     [614563, 4737828],
                     [614563, 4743332],
                     [602979, 4743332]
               ]))
            }
       ]
   });
</script>
Detalles

SITNA.layer.LayerOptions

StyleOptions

Descripción

Opciones de estilo de entidades geográficas.

Propiedades
Nombre Tipo Atributos Descripción
point SITNA.feature.PointStyleOptions <optional>

Opciones de estilo de punto.
line SITNA.feature.PolylineStyleOptions <optional>

Opciones de estilo de línea.
polygon SITNA.feature.PolygonStyleOptions <optional>

Opciones de estilo de polígono.
marker SITNA.feature.MarkerStyleOptions <optional>

Opciones de estilo de marcador (punto de mapa con icono).
cluster SITNA.layer.ClusterStyleOptions <optional>

Opciones de estilo de cluster de puntos. Consultar la propiedad cluster de SITNA.layer.LayerOptions para saber cómo mostrar clusters.
heatmap SITNA.layer.HeatmapStyleOptions <optional>

Opciones de estilo de mapa de calor.
Detalles

VectorOptions

Descripción

Opciones de capa vectorial. Este objeto se utiliza al configurar un mapa o el control del catálogo de capas, o como parámetro al añadir una capa.

Propiedades
Nombre Tipo Atributos Valor por defecto Descripción
id string

Identificador único de capa. No puede haber en un mapa dos capas con el mismo valor de id.
cluster SITNA.layer.ClusterOptions <optional>

La capa agrupa sus entidades puntuales cercanas entre sí en grupos (clusters).
featureType string <optional>

Nombre de la capa del servicio WFS que queremos representar. Propiedad obligatoria solamente en capas de tipo WFS.
filter string | SITNA.filter.Filter <optional>

Filtro en formato SITNA.filter, GML o CQL. En el caso de tratarse de capas WFS se añade a las peticione GetFeature el parámetro filter o cql_filter correspondiente.
format string <optional>

Tipo MIME del formato de archivo de datos geográficos que queremos cargar (GeoJSON, KML, etc.). Para asignar valor a esta propiedad se pueden usar las constantes definidas en SITNA.Consts.mimeType.
hideTree boolean <optional>

Aplicable a capas de tipo KML. Si se establece a true, la capa no muestra la jerarquía de grupos de capas en la tabla de contenidos ni en la leyenda.
isBase boolean <optional>

Si se establece a true, la capa es un mapa de fondo.
isDefault boolean <optional>

Obsoleta: En lugar de esta propiedad es recomendable usar la propiedad defaultBaseLayerde SITNA.MapOptions.

Si se establece a true, la capa se muestra por defecto si forma parte de los mapas de fondo.
overviewMapLayer SITNA.layer.LayerOptions | string <optional>

Definición de la capa que se utilizará como fondo en el control de mapa de situación cuando esta capa está de fondo en el mapa principal. Si el valor es de tipo string, tiene que ser un identificador de capas de la API SITNA (un miembro de SITNA.Consts.layer).

La capa del mapa de situación debe ser compatible con el sistema de referencia de coordenadas del mapa principal (ver propiedad crs de SITNA.MapOptions).
outputFormat string <optional>

Tipo MIME del formato en el cual se desea la respuesta del servicio WFS. Para asignar valor a esta propiedad se pueden usar las constantes definidas en SITNA.Consts.format. El valor por defecto es GML2, aunque se aconseja usar JSON si el servicio lo soporta; para saberlo, consultar previamente las capacidades del servicio.
properties string | Array.<string> <optional>

Lista de propiedades soliciadas (PropertyName) en la peticion GetFeature. Puede ser un array de cadenas o bien una cadena de textos separados por comas.
stealth boolean <optional>

Si se establece a true, la capa no aparece en la tabla de contenidos ni en la leyenda. De este modo se puede añadir una superposición de capas de trabajo que el usuario la perciba como parte del mapa de fondo.
styles SITNA.layer.StyleOptions <optional>

Descripción de los estilos que tendrán las entidades geográficas de la capa.
thumbnail string <optional>

URL de una imagen en miniatura a mostrar en el selector de mapas de fondo.
title string <optional>

Título de capa. Este valor se mostrará en la tabla de contenidos y la leyenda.
type string <optional>
 SITNA.Consts.layerType.VECTOR

Tipo de capa. La lista de valores posibles está definida en SITNA.Consts.layerType.
url string <optional>

URL del servicio OGC o del archivo de datos geográficos que define la capa. Propiedad obligatoria en capas de tipo WFS y KML.

Los archivos de datos geográficos soportados son KML, GeoJSON, GPX, GML, WKT y TopoJSON. El formato se deduce de la extensión del nombre de archivo, pero también se puede especificar utilizando la propiedad format.

En el caso de que un fichero KML tenga definido el estilo del bocadillo, este formato será usado al renderizar el bocadillo en visores basados en la API SITNA.
Ejemplos

Ejemplo de uso de la capa vectorial de tipo WFS Ver en vivo


<div id="mapa"></div>
<script>
   // Establecemos un layout simplificado apto para hacer demostraciones de controles.
      SITNA.Cfg.layout = "layout/ctl-container";
      // Añadimos el control de tabla de contenidos en la primera posición.
      SITNA.Cfg.controls.TOC = {
          div: "slot1"
      };
      var map = new SITNA.Map("mapa", {
          // Mapa centrado de Pamplona
          initialExtent: [606239, 4738249, 614387, 4744409],
          // Añadimos la capa de GeoPamplona del catálogo de edificios filtrada para mostrar solamente los de uso cultural.
          // Añadimos también la capa de IDENA de museos filtrada para mostrar solamente los que están en Pamplona.
          // Añadimos también la capa de IDENA de edificios religiosos filtrando por los contenidos en un polígono dado.
          workLayers: [
              {
                  id: "layer1",
                  title: "Catálogo de edificios de Pamplona de uso cultural",
                  type: SITNA.Consts.layerType.WFS,
                  url: "//sig.pamplona.es/ogc/wfs",
                  featureType: "PROY_Pol_Edificios",
                  filter: '<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc"><ogc:PropertyIsEqualTo><ogc:PropertyName>GRUPOEDIF</ogc:PropertyName><ogc:Literal><![CDATA[CULTURAL]]></ogc:Literal></ogc:PropertyIsEqualTo></ogc:Filter>'
              },
              {
                  id: "layer2",
                  title: "Museos localizados en Pamplona",
                  type: SITNA.Consts.layerType.WFS,
                  url: "//idena.navarra.es/ogc/wfs",
                  featureType: "IDENA:DOTACI_Sym_Museos",
                  filter: "POBLACION='Pamplona / Iruña'",
                  outputFormat: SITNA.Consts.format.JSON
              },
              {
                  id: "layer3",
                  title: "Edificios religiosos",
                  type: SITNA.Consts.layerType.WFS,
                  url: "//idena.navarra.es/ogc/wfs",
                  featureType: "DOTACI_Sym_EdifReligi",
                  filter: SITNA.filter.Within("the_geom",new SITNA.feature.Polygon([
                        [602979, 4743332],
                        [602979, 4737828,
                        [614563, 4737828],
                        [614563, 4743332],
                        [602979, 4743332]
                  ]))
            }
          ]
      });
</script>
Detalles

SITNA.layer.LayerOptions

WmsGroupOptions

Descripción

Opciones de grupo de sugerencias de servicios externos WMS.

Propiedades
Nombre Tipo Descripción
group string

Nombre del grupo de sugerencias. Se mostrará como una sección en la lista de opciones del control.
items Array.<SITNA.layer.WmsOptions>

Lista de sugerencias de servicios externos WMS.
Detalles

SITNA.control.DataLoaderOptions

WmsOptions

Descripción

Opciones de sugerencia de servicio externo WMS.

Propiedades
Nombre Tipo Descripción
name string

Nombre del servicio WMS. Se mostrará como un elemento en la lista de opciones del control.
url string

URL de acceso al servicio WMS.
Detalles

SITNA.layer.WmsGroupOptions