Openlayers: las herramientas disponibles por defecto

Nota:

EN: THIS IS STILL A DRAFT ES: SIGUE SIENDO UN BORRADOR

=OpenLayers: las herramientas disponibles por defecto = Aquí presentamos las herramientas mas importantes que Openlayers nos ofrece.

OpenLayers es principalmente una API, una biblioteca de funciones para manejar la navegación de mapas en la web y como tal no está pensada para ofrecer una GUI. Sin embargo nos proporciona también una cuantos objetos muy útiles para la interacción del usuario con el mapa.



{| class="wikitable" !Control !! Descripción
 * [[Image:Openlayers control layerswitcher.png]]
 * [[Image:Openlayers control layerswitcher.png]]

LayerSwitcher
El control para la gestión de la visibilidad de capas
 * [[Image:Openlayers control pan.png|center]]
 * [[Image:Openlayers control pan.png|center]]

PanZoomBar
Crea una barra de zoom y un panel de navegación que contienen los botones de ZoomIn y ZoomOut a los extremos. Hay tres maneras para utilizar la zoom bar:


 * 1) Clic sobre los botones de + o - puestos a los extremos de la barra.
 * el resultado será el aumento/disminución de un nivel de zoom


 * 1) Clic en cualquier punto de la zoom bar
 * el desplazador (slider) se mueve al nivel de zoom más cercano. El mapa se actualiza al nivel de zoom correspondiente.


 * 1) Desplazamiento del cursor a un nivel de zoom concreto
 * cuando se deja el botón del ratón, el slider se posiciona en el nivel de zoom más cercano y el mapa se actualiza al nivel de zoom correspondiente.


 * [[Image:Openlayers control OverviewMap.png|center]]
 * [[Image:Openlayers control OverviewMap.png|center]]

OverviewMap
Crea una pequeño mapa de navegación. Este mapa enseña la posición del mapa principal y ofrece una herramienta más de navegación. Normalmente se posiciona en el ángulo inferior derecho y puede ser reducido con un clic en el botón que tiene en su borde. El rectángulo dibujado en este mapa puede ser movido para cambiar la posición del mapa principal.


 * [[Image:Openlayers control Permalink.png|center]]
 * [[Image:Openlayers control Permalink.png|center]]

Permalink
Ofrece un enlace (permalink) al mapa. Esto permite poder guardar en un simple enlace el estado de la navegación del mapa. Así, puedes guardarlo como favorito en tu navegador o enviarlo por correo a un colega.
 * [[Image:Openlayers control MouseToolbar.png|center]]
 * [[Image:Openlayers control MouseToolbar.png|center]]

MouseToolbar
Es una simple barra de herramientas que permite escoger cómo utilizar el ratón entre navegación y zoom con ventana.
 * [[Image:Openlayers control ScaleLine.png|center]]
 * [[Image:Openlayers control ScaleLine.png|center]]

ScaleLine
Enseña una escala gráfica sobre el mapa.
 * [[Image:Openlayers control MousePosition.png|center]]
 * [[Image:Openlayers control MousePosition.png|center]]

MousePosition
Enseña las coordenadas actuales del cursor sobre el mapa.
 * }

=la API= Los Objectos de la biblioteca de Openlayers están bien descritos, en inglés, en la documentación el linea disponible en el sitio web:
 * http://dev.openlayers.org/releases/OpenLayers-2.6/doc/apidocs/files/OpenLayers-js.html

Por cada clase hay una descripción detallada y se ofrece el listado de los atributos y funciones. Quien esta mas confiado con el código en general y el Javascript en especifico encontrará muy fácil desarrollar aplicaciones de mapas en la web que utilicen esta biblioteca.



=Ejemplo en código= En el código que sigue tenemos un ejemplo sencillo de como se pueden integrar facilmente todos los Controls descriptos antes.

Lo podemos copiar y guardar en un fichero con recorrido: C:\ms4w\apps\mapserv-demo\ol_controls.html

una vez guardado estará disponible en el servidor local con este enlace :
 * http://localhost:9000/mapserv-demo/ol_controls.html

el código
 Ejemplo de utilizo de los Controls de Openlayers  #map { width: 512px; height: 412px; border: 1px solid black; }        #permalink{ position:absolute; margin-left:522px; }      var map; function init{ map = new OpenLayers.Map('map', { 				controls: [ 					new OpenLayers.Control.PanZoomBar, 					new OpenLayers.Control.MouseToolbar, 					new OpenLayers.Control.LayerSwitcher({'ascending':false}), 					new OpenLayers.Control.ScaleLine, 					new OpenLayers.Control.Permalink('permalink'), 					new OpenLayers.Control.MousePosition, 					new OpenLayers.Control.OverviewMap, 					new OpenLayers.Control.KeyboardDefaults 				], 				numZoomLevels: 6 			}); var ol_wms = new OpenLayers.Layer.WMS( "OpenLayers WMS", 				"http://labs.metacarta.com/wms/vmap0", 				{layers: 'basic'} ); var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic", 				"http://t1.hypercube.telascience.org/cgi-bin/landsat7", 				{layers: "landsat7"}); var dm_wms = new OpenLayers.Layer.WMS( "DM Solutions Demo", 				"http://www2.dmsolutions.ca/cgi-bin/mswms_gmap", 				{layers: "bathymetry,land_fn,park,drain_fn,drainage," + 						 "prov_bound,fedlimit,rail,road,popplace", 				 transparent: "true", format: "image/png" }); jpl_wms.setVisibility(false); dm_wms.setVisibility(false); map.addLayers([ol_wms, jpl_wms, dm_wms]); if (!map.getCenter) map.zoomToMaxExtent; }    Ejemplo de utilizo de los Controls de Openlayers Añadir zoom, navegación, layer switcher, overview map y enlaces permalink a la mapa de Openlayers. Permalink

el objecto mapa
En la creación del objecto mapa se añaden el parámetro de los Controls ("controls") y su valor es un array  que contiene todos los Controls que hemos visto antes.

map = new OpenLayers.Map('map', { 				 controls: [ 					 new OpenLayers.Control.PanZoomBar,  					 new OpenLayers.Control.MouseToolbar,  					 new OpenLayers.Control.LayerSwitcher({'ascending':false}),  					 new OpenLayers.Control.ScaleLine,  					 new OpenLayers.Control.Permalink('permalink'),  					 new OpenLayers.Control.MousePosition,  					 new OpenLayers.Control.OverviewMap,  					 new OpenLayers.Control.KeyboardDefaults  				 ],  				numZoomLevels: 6 			});

En este caso solo los Controls LayerSwitcher y Permalink tienen atributos pero mirando la API nos podemos enterar de todas las funciones que cada uno de estos objectos tienen y que podemos utilizar para personalizar nuestra web.

=Links=
 * Smart Map Browsing,Emanuel Schütze, Bremen University of Applied Sciences ,June 1st 2007: http://www.smartmapbrowsing.org

=Autores=
 * Lorenzo Becchi
 * Jorge Gaspar Sanz Salinas

=Referencias=

=Licencia=
 * la licencia por este articulo es: Creative Commons Attribution 3.0 License (http://creativecommons.org/licenses/by/3.0/deed.es).
 * esta licencia permite:
 * copiar, distribuir y comunicar públicamente la obra
 * hacer obras derivadas
 * bajo estas condiciones:
 * Reconocimiento. Debe reconocer los créditos de la obra de la manera especificada por el autor o el licenciador (pero no de una manera que sugiera que tiene su apoyo o apoyan el uso que hace de su obra).
 * Al reutilizar o distribuir la obra, tiene que dejar bien claro los términos de la licencia de esta obra.
 * Alguna de estas condiciones puede no aplicarse si se obtiene el permiso del titular de los derechos de autor
 * Nada en esta licencia menoscaba o restringe los derechos morales del autor.

=Duración= Por esta clase se evalúa una duración de X horas