Manual para desarrolladores
Manual para desarrolladores
Argenmap v2 desde CDN
jQuery https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
Argenmap v2 http://www.ign.gob.ar/argenmap2/argenmap.jquery.min.js
Crear un mapa con Argenmap v2
$(selector).argenmap()
Esta función crea una instancia de mapa sobre un elemento html. Preferentemente contenedores divs
con un alto definido en píxels. Argenmap v2 puede instanciarse pasando un objeto como argumento. El objeto puede tener opciones de inicialización. A continuación se puede ver el detalle de las opciones con las que puede inicializarse Argenmap v2
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
opciones | objeto |
no |
Objeto con opciones de inicialización |
Opciones
nombre | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
zoom | int | 4 |
no |
Establece el nivel de zoom inicial para el mapa |
centro | array | [-35,-57] |
no |
Establece las coordenadas del centro del mapa. Es un arreglo compuesto por latitud y longitud . |
tipo | string | baseign |
no |
Indica el tipo de mapa que va a instanciarse. Las opciones son vacio , blanco : un mapa sin ninguna capa, satelite ; satelital , hibridoign : mapa con la vista de imágenes de satélite; baseign : mapa con la capa base del IGN. |
proyeccion | string | EPSG:3857 |
no |
La proyección que tendrá el mapa. Estas pueden ser EPSG:3857 y EPSGL:4326 . |
capas | array | [] |
no |
Un arreglo con strings de capas predefinidas. Esta opción puede ser usada en conjunto con tipo blanco para instanciar un mapa con sólo una de las capas (baseign y satelite . |
listarCapaDeMarcadores | boolean | false |
no |
Indica si las capas que contienen los marcadores (si los hubiere) serán visibles en la lista de capas, permitiendo prender y apagar la capa desde el control del mapa. |
mapaFijo | boolean | false |
no |
Si se provee esta opción en true se eliminan los controles de navegación y de zoom, haciendo que el mapa no pueda moverse salvo que se haga por código. |
mostrarBarraDeZoom | boolean | false |
no |
Configurando esta opción en true puede visualizarse una barra para controlar el nivel de zoom. |
proxy | string | http://crossproxy.aws.af.cm/?u= |
no |
Opción para usar un proxy en todas las consultas que deban hacerse fuera del dominio donde se está mostrándose el mapa. Usar un string vacío para anular la opción. |
La barra de zoom se ocultará automáticamente si el alto del mapa no fuera suficiente, aún cuando se hubiese configurando mostrarBarraDeZoom
en modeo true
.
Las capas satelitales y base están preparadas para mostrarse en EPSG:3857
. Si fuese necesario instanciar un mapa en EPSG:4326
para luego importar capas WMS que necesiten esa proyección, se deberá hacerlo con la opción tipo blanco
y luego agregar las capas WMS necesarias.
Cambiar la vista con Argenmap v2
$(selector).centro()
Luego de instanciar un mapa, puede usarse .centro(lat,lng)
para cambiar el centro del mapa.
Si llamás a .centro()
sin parámetros, devuelve el centro actual del mapa, un arreglo
del tipo [lat,lng].
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
lat | float | null |
sí |
número indicando los grados decimales de latitud |
lng | float | null |
sí |
número indicando los grados decimales de longitud |
Cuando se usa .centro()
para pedir las coordenadas del centro del mapa se rompe la encadenabilidad de jQuery y este devuelve un arreglo
.
$(selector).zoom()
Aumenta, disminuye o devuelve el nivel de zoom.
Si llamás a zoom() sin parámetros, devuelve un int
que representa el nivel de escala del mapa.
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
zoom | int | null |
sí |
un entero de 0 a 19 indicando el nivel de zoom al que se quiere visualizar el mapa. |
Cuando se usa .zoom()
para pedir el nivel de zoom del mapa se rompe la encadenabilidad de jQuery y este devuelve un int
.
Agregar capas base y superponer capas propias con Argenmap v2
$(selector).capaBase()
Esta función permite cambia a la capa base.
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
capaBase | string | null |
sí |
El nombre de una de las capas base estándar (Satélite o Base IGN ) o el nombre de una capa base previamente agregada con |
Cuando se usa .capaBase()
para pedir la capa base actual del mapa se rompe la encadenabilidad de jQuery y este devuelve un string
indicando el nombre de la capa base actual del mapa.
$(selector).agregarCapaWMS()
Superpone una capa desde un servicio WMS al mapa
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
opciones | objeto | null |
sí |
un set de pares de key :valor que configura el pedido a la capa WMS. Las keys que pueden pasarse son los parámetros que pueden pasarse a cualquier WMS: |
Opciones
nombre | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
url | string | string vacío |
sí |
La URL del servidor WMS. Ejemplo: http://mapa.ign.gob.ar/wms? . La url debe finalizar con el signo ? o con el signo & ;
|
capas | string | string vacío |
sí |
Los nombres de las capas separados por comas. (corresponde al formato del parámetro LAYERS de WMS) de las capas que se quieren pedir al servidor WMS, separadas por coma. Ejemplo: departamentos,rios,ciudades |
nombre | string | string vacío |
no |
Nombre que tendrá la capa a agregar. Este es el nombre que se mostrará en el administrador de capas. |
formato | string | image/png |
no |
el formato MIME de archivo: image/jpeg , image/jpg , image/png , image/png8 , image/gif
|
transparente | boolean | true |
no |
Indica si la capa se pedirá en modo transparente al servicio WMS. Esta opción funciona en conjunto con formato . |
esCapaBase | boolean | false |
no |
Indica si la capa debe tratarse como una capa base o una capa superpuesta. Las capas base pueden alternarse con otras capas base, las superpuestas pueden prenderse o apagarse. |
mostrarAlCargar | boolean | true |
no |
Indica si la capa debe mostrarse una vez que sea agregada. En el caso de ser una capa base esta opción hará que se cambie automáticamente a esta capa una vez cargada. |
proyeccion | string | La proyección en la que esté instanciado el mapa. |
no |
Indica la proyección en la que se pide la capa al servicio WMS. Debe coincidir con la proyección en la que se instanció el mapa. |
version | string | 1.1.1 |
no |
Indica como debe ser conformado el pedido al servicio WMS según la version del servidor WMS que se está consultando. |
El nombre utilizado para la capa también será el que se utilice para hacer referencia a la capa en otros métodos como quitarCapa
o modificarCapa
. Es posible dejarlo vacío, sin embargo es considerado una buena práctica la asignación de un nombre
El servicio WMS tiene que estar configurado para poder generar las imágenes con el sistema de referencia EPSG:3857
que es el código que define la proyección de OpenStreetMap, Google Maps, Bing Maps, ESRI WEB Maps y demás mapas web populares.
$(selector).agregarCapaBaseWMS()
Esta función agrega una capa base desde un servicio WMS al mapa. Esta función es igual a agregarCapaWMS
pero con todas las opciones configuradas por defecto para conformar una capa base.
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
opciones | objeto | null |
sí |
un set de pares de key :valor que configura el pedido a la capa WMS. Las keys que pueden pasarse son los parámetros que pueden pasarse a cualquier WMS: |
Opciones
nombre | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
url | string | string vacío |
sí |
La URL del servidor WMS. Ejemplo: http://mapa.ign.gob.ar/wms? . La url debe finalizar con el signo ? o con el signo & ;
|
capas | string | string vacío |
sí |
Los nombres de las capas separados por comas. (corresponde al formato del parámetro LAYERS de WMS) de las capas que se quieren pedir al servidor WMS, separadas por coma. Ejemplo: departamentos,rios,ciudades |
nombre | string | string vacío |
no |
Nombre que tendrá la capa a agregar. Este es el nombre que se mostrará en el administrador de capas. |
formato | string | image/jpeg |
no |
el formato MIME de archivo: image/jpeg , image/jpg , image/png , image/png8 , image/gif
|
transparente | boolean | false |
no |
Indica si la capa se pedirá en modo transparente al servicio WMS. Esta opción funciona en conjunto con formato . |
esCapaBase | boolean | true |
no |
Indica si la capa debe tratarse como una capa base o una capa superpuesta. Las capas base pueden alternarse con otras capas base, las superpuestas pueden prenderse o apagarse. |
mostrarAlCargar | boolean | true |
no |
Indica si la capa debe mostrarse una vez que sea agregada. En el caso de ser una capa base esta opción hará que se cambie automáticamente a esta capa una vez cargada. |
proyeccion | string | La proyección en la que esté instanciado el mapa. |
no |
Indica la proyección en la que se pide la capa al servicio WMS. Debe coincidir con la proyección en la que se instanció el mapa. |
version | string | 1.1.1 |
no |
Indica como debe ser conformado el pedido al servicio WMS según la version del servidor WMS que se está consultando. |
El nombre utilizado para la capa también será el que se utilice para hacer referencia a la capa en otros métodos como quitarCapa
o modificarCapa
. Es posible dejarlo vacío, sin embargo es considerado una buena práctica la asignación de un nombre
El servicio WMS tiene que estar configurado para poder generar las imágenes con el sistema de referencia EPSG:3857
que es el código que define la proyección de OpenStreetMap, Google Maps, Bing Maps, ESRI WEB Maps y demás mapas web populares.
$(selector).agregarCapaKML()
Esta función superpone una capa KML en el mapa
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
opciones | objeto | null |
sí |
un set de pares de key :valor que configura la capa KML. |
Opciones
nombre | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
url | string | string vacío |
sí |
La URL del archivo KML. |
nombre | string | string vacío |
no |
Nombre que tendrá la capa. Este es el nombre que se mostrará en la lista de capas. |
agruparItems> | boolean | true |
no |
Indica si los marcadores de la capa KML deben ser agrupados cuando estén demasiado juntos |
sld | string | string vacío |
no |
URL de un archivo de estilización en formato SLD |
filtro | string | string vacío |
no |
tipo de geometría a mostrar. Valores posibles Point , Line o Polygon . Configurando este filtro se solucionan problemas que posee el importador de kml cuando se encuentra con multi-geometrías.
|
Los archivos KML y SLD deben encontrarse en el mismo dominio, de lo contrario se recibirá un error de "Política del mismo origen (Same origin policy)".
Para evitar el error "Política del mismo origen (Same origin policy)" Argenmap v2 utiliza un proxy simple en PHP configurado a través de la opciónn proxy Una vez asignado, todos las solicitudes pasan a través de dicho proxy. Es posible utilizar un script de proxy propio y configurarlo asignando una url a proxy
.
$(selector).agregarImagen()
Esta función superpone una imagen en el mapa
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
opciones | objeto | null |
sí |
un set de pares de key :valor que configura la capa imagen. |
Opciones
nombre | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
url | string | string vacío |
sí |
La URL del archivo de imagen, puede ser relativa o absoluta. |
nombre | string | string vacío |
no |
Nombre que tendrá la capa. Este es el nombre que se mostrará en la lista de capas. |
limites | array | [] |
si |
Un arreglo compuesto por coordenadas Sur, Oeste, Norte y Este |
transparencia | float | 1 |
no |
valor de transparencia para la capa de imagen. Es un valor entre 0 y 1 |
encuadrarAlCargar | boolean | false |
no |
Indica si el nivel de zoom del mapa debe ajustarse para mostrar la imagen cargada o no. |
$(selector).quitarCapa()
Esta función quita una capa del mapa. La referencia a la capa que se desea quitar es a través del nombre
asignado a la capa.
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
nombre | string | null |
sí |
El nombre asignado a la capa cuando fue creada. |
Agregar marcadores con Argenmap v2
$(selector).agregarMarcador()
Esta función crear un marcador mediante opciones o simplemente haciendo la llamada $(selector).agregarMarcador()
, y por defecto el marcador se agregará en el centro del mapa.
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
opciones | objeto | null |
sí |
un set de pares de key :valor que configura opciones extra para el marcador que va a ser creado: |
Opciones
nombre | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
lat | float | null |
sí |
La latitud para el marcador (coordenadas geográficas) |
lon | float | null |
sí |
La longitud para el marcador (coordenadas geográficas) |
nombre | string | Marcador |
no |
El nombre que tendrá el marcador. Recordá que si bien es opcional, es importante definir el nombre e intentar que sea único para luego poder accederlo si necesitaras modificarlo o quitarlo. |
ícono | string | null |
no |
El nombre de uno de los íconos de la galeria o bien la URL de la imagen PNG a utilizar como ícono. |
contenido | string | null |
no |
Contenido HTML que se mostrará al hacer click sobre el marcador. Si no se provee esta opción, el marcador ignorará el click del mouse. |
mostrarContenido | boolean | false |
no |
Indica si el contenido del marcador debe mostrarse automáticamente al agregar el marcador |
capa | string | Marcadores |
no |
Los marcadores se agregan en una capa en el mapa. Con este parámetro podés indicar en qué capa se van a agregar. De no existir la capa, se crea automáticamente. Con esta opción se pueden generar grupos de marcadores que luego podrás apagar o prender activando y desactivando la capa (ver siguiente opción: listarCapa) |
listarCapa | boolean | false |
no |
Por defecto la capa donde se apoyan los marcadores no se lista en el administrador de capas. Si se configura este valor a true la capa aparecerá en el administrador de capas para poder activarla o desactivarla convenientemente. |
Si se incorpora un marcador con el mismo nombre que otro, el más nuevo reemplazará al anterior. Este comportamiento provoca que al agregar más de un marcador sin nombre, los mismos se sobreescriban.
$(selector).modificarMarcador()
Esta función modifica un marcador previamente creado. Las opciones para modificar el marcador son las mismas que al momento de crear uno. La referencia del marcador a modificar es el nombre
asignado al marcador y es el primer parámetro de este método.
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
nombre | string | null |
sí |
El nombre asignado al marcador cuando fue creado. |
opciones | objeto | null |
sí |
set de pares key :valor con las mismas opciones que se usan para crear un marcador
|
$(selector).quitarMarcador()
Esta función elimina un marcador del mapa.
La referencia al marcador a eliminar es a través del nombre
asignado al marcador.
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
nombre | string | null |
sí |
El nombre asignado al marcador cuando fue creado. |
$(selector).agregarMarcadores()
Esta función crea varios marcadores sobre el mapa a partir de un arreglo de objetos que definen las opciones de cada marcador. Cada objeto es igual al que recibe agregarMarcador().
Argumentos
argumento | tipo | predeterminado | requerido | descripción |
---|---|---|---|---|
[marcador1, marcador2,..., marcadorN] | array | null |
sí |
Arreglo de objetos simples. Cada objeto debe ser un objeto de opciones válido como se usaría con agregarMarcador(). |
Galería de íconos
La galería de íconos es un diccionario de conveniencia para utilizar marcadores predeterminados. En lugar de suministrar la url de una imagen que se fuera a utilizar como ícono de un marcador, es posible usar el nombre de uno de estos íconos.
Por ejemplo, estas dos llamadas a .agregarMarcador()
tienen el mismo resultado:
$('#mapa').agregarMarcador({icono:"tornado"})
$('#mapa').agregarMarcador({icono:"http://ign.gob.ar/argenmap2/argenmap.jquery/img/iconos/tornado.png"})
Íconos disponibles
nombre | ícono | descripción |
---|---|---|
aeropuerto | ![]() |
Aeropuertos y pistas de aterrizaje |
cajero | ![]() |
ATM / Cajero electrónico |
correo | ![]() |
Correo |
restaurante | ![]() |
Comedor / Restaurante |
hospital | ![]() |
Hospital / Clínica |
policia | ![]() |
Comisaría / Estación de policía |
estacionDeServicio | ![]() |
Estación de servicio |
tren | ![]() |
Estación de tren |
manifestacion | ![]() |
Manifestación / Turba |
peligro | ![]() |
Atención / Peligro |
delito | ![]() |
Delito / Crimen |
inundacion | ![]() |
Inundaciones |
tormenta | ![]() |
Tormenta |
tornado | ![]() |
Tornado |
terremoto | ![]() |
Terremoto / Derrumbe |
volcan | ![]() |
Erupción volcánica / Cenizas |
corteDeLuz | ![]() |
Corte de luz / Apagón |
pico | ![]() |
Montaña / Cerro / Pico |
cascada | ![]() |
Cascada / Salto |
glaciar | ![]() |
Glaciar |
El marcador utiliza como punto de anclaje el centro horizontal y el borde inferior de la imagen. Para mayor información ver Map Icons Collection.
API OpenLayers
Argenmap v2 utiliza la API de OpenLayers versión 2.12.
Una vez que se instancia Argenmap v2 en un selector, se guarda una instancia de clase argenmap
asociado al mismo a través de la funcionalidad $.data()
de jQuery.
Asimismo, la clase argenmap
guarda una instancia de clase OpenLayersMap en la propiedad mapa
. Referenciando a esta propiedad podés acceder a cualquier otra funcionalidad que necesites de OpenLayers para realizar operaciones y aplicaciones más complejas:
var claseOpenLayersMap = $('#mapa').data('argenmap').mapa; claseOpenLayersMap.getZoom(); //devuelve el nivel de zoom actual del mapa