Openlayers: configuración mínima con biblioteca en remoto

=Openlayers: configuración mínima con biblioteca en remoto= considerando la configuración de los mapas Itasca lo que necesitamos para crear nuestra primera mapa web son estos datos:
 * la dirección del servidor WMS
 * http://localhost:9000/cgi-bin/mapserv.exe?map=/ms4w/apps/mapserv-demo/itasca.map
 * el nombre de la capa que queremos visualizar
 * drgs
 * la proyection de nuestro mapa
 * EPSG:26915
 * el extent de nuestro mapa (min x, min y, max x, max y)
 * 378107 5193120 510896 5320243
 * la unidad de medidas
 * metros

código de ejemplo
para crear la página web necesitamos crear un nuevo fichero con un editor de texto sencillo. Este fichero lo llamaremos:

C:\ms4w\apps\mapserv-demo\ol.html

luego hay que poner el siguiente texto en ella:

comprobar la página web con el mapa
una vez guardada la página web con el código añadido podemos comprobar con nuestro browser web (ex: Mozilla Firefox, Internet Explorer, ecc.) si la página responde como esperamos:


 * http://localhost:9000/mapserv-demo/ol.html

este es el resultado:

Todo lo que hay que notar en nuestro código
El código que hemos utilizado es de verdad muy poco pero hay que estar muy atentos a que lo que se escriba sea exacto y tenga sentido.

el estilo CSS
El mínimo de estilo CSS que necesitamos es para posicionar el marco del mapa. A este DIV se le da el ID de MAP. Los elementos importantes son el alto (width) y el ancho (height).

la biblioteca Javascript de Openlayers
para que se pueda crear el mapa es indispensable la biblioteca de código de Openlayers que se puede utilizar de varias maneras. La mas cómoda, para comenzar, es utilizar su versión publicada online.

el código Javascript personalizado
para definir nuestro mapa especifico tenemos que dar unas indicaciones a Openlayers, como qué mapa utilizar y cómo enseñarlo.

se crean las dos variable de mapa y de layer. se define la función de inicialización que llamamos init. se instancia el objecto map como un OpenLayers.Map y como parámetros le pasamos el nombre del DIV donde hay que mostrar el mapa (map) y los parámetros de contexto de nuestro mapa (extent, unidades, proyección). se instancia un objecto layer como un OpenLayers.Layer.WMS. Se trata de nuestra capa WMS y por eso, como parámetros, le pasamos layers: 'drgs' y es la dirección del servidor WMS (http://localhost:9000/cgi-bin/mapserv.exe?map=/ms4w/apps/mapserv-demo/itasca.map). añadimos el objecto layer al objecto map. una vez que todos los objectos esten definidos podemos pedir al mapa de centrarse para la visualización al usuario final.

la llamada de arranque
para que el código Javascript que hemos escrito se active al cargar de la página web hay que darle este comando al tag BODY. En práctica significa que una vez que ha cargado el código HTML el browser tiene que ejecutar la función javascript init.

el DIV del mapa
en el poco código HTML que hemos puesto en este ejemplo hay solo un elemento que es fundamental: el DIV del mapa. Como su ID es map, tendrá el estilo que hemos definido en el CSS.

=Autores=
 * Lorenzo Becchi
 * Jorge Gaspar Sanz Salinas

=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 oras