Oct 25

He leído “OpenLayers 2.10 Beginner’s Guide”

http://blog.sonxurxo.com/wp-content/uploads/2011/03/openlayers-beginners-guide.pngAcabo de leer OpenLayers 2.10 Beginner’s Guide 

OpenLayers es una librería javascript que nos permite hacer aplicaciones con mapas en nuestra página web. Los mapas pueden ser los de Google Maps, Bing, OpenStreetMap o servidor por cualquier servidor que cumpla los estándares OGC, como Geoserver. OpenLayers "traga" además otro montón de formatos para dibujar mapas directamente de ficheros.

El libro es muy básico, empieza desde el principio, tan desde el principio que incluso nos explica lo básico de javascript y qué son las clases, la herencia, los métodos y atributos. Por supuesto, no se entretiene demasiado en ello, una simple explicación para no pillarse los dedos según va avanzando en OpenLayers.

Si, como yo, has empezado con OpenLayers a base de ensayo y error, copy-paste de código en google y ya tienes algo de experiencia, este libro es muy básico, pero siempre acalara algún concepto que puedes no haber "pillado" en tus pruebas, ensayos, errores, copies y pastes.

Es ideal sin embargo para leer antes de empezar con OpenLayers, el libro va despacio, no es muy complejo lo que explica y va asentando bases antes de seguir. Cada apartado resulta un poco repetitivo porque primero te explica cómo funciona, luego te lo vuelve a explicar mientras te dice cómo codificarlo y finalmente te lo vuelve a explicar añadiendo un título "¿Qué acaba de pasar?" después de que hayas ejecutado el ejemplo que acabas de codificar. Lo dicho, ideal para quien no tiene idea del tema y le gusta asentar bien las cosas.

 

Mar 13

Extraños errores de javascript con Firefox y OpenLayers

 Estamos (seguimos) haciendo un mapa con geoserver en el lado del servidor y OpenLayers en el lado del navegador. Todo va más o menos de perlas dentro de lo que cabe en cualquier proyecto software, hasta que un cliente nos lanza la incidencia de que no puede ver el mapa con Firefox. Revisando veo que el mapa se ve perfectamente con Chrome, con Internet Explorer y con las versiones viejas de Firefox, pero no con las nuevas (de la 7 hacia arriba).

Saco la consola de errores y encuentro errores tan extraños como estos OpenLayers.Class is not a function, OpenLayers.Geometry is undefined, …

Por supuesto, no es problema de carga de librerías javascript, con otros navegadores funciona bien y no aparecen errores 404 de ficheros .js no encontrados.

Aunque desconcertante inicialmente, la solución fue sencilla. Hay algún tipo de incompatibiidad entre la versión de Openlayers que estaba usando (una del año pasado) y la interpretación de javascript de los firefox nuevos. No me he metido a ver cual era exactamente el motivo, pero bastó con actualizar la versión de OpenLayers a la más moderna.

Jun 03

Chrome vs Explorer

 Como he comentado más veces, estamos haciendo un portal web con mapa (Geoserver + Openlayers). En ese mapa debemos pintar las posiciones de los barcos (algo similar a http://www.localizatodo.com/mapa/ ). Geoserver ofrece dos tipos de Web Service para obtener los barcos y poder pintarlos en el mapa. Ojo, Geoserver no sabe los datos de los barcos, simplemente los lee de su base de datos y algún proceso externo tiene que rellenar dicha base de datos.

Uno de ellos, WFS, consiste en que a través del WebService y en formato XML te da los datos de los barcos (posición, velocidad, rumbo, nombre del barco, tipo de barco, etc). Es el navegador con javascript (y en concreto la librería OpenLayers), la encargada de dibujar los barcos sobre el mapa.

Pues bien, con esta aproximación y con sólo unos tres mil barcos para probar (la base de datos contiene algo menos de treinta mil), Chrome funciona perfectamente. Se puede hacer zoom en el mapa, desplazarlo y jugar con él sin notar ningún retraso importante en los refrescos. Pero Internet Explorer es otra cosa. Con tres mil barcos…. se queda colgado el navegador entero. En cuanto haces zoom, intentas mover el mapa o cualquier cosa, deja de refrescarse, deja de contestar y ni siquiera puedes abrir otras pestañas, cerrarlas, o cerrar el navegador. En fin, una diferencia importante de eficiencia de javascript entre internet explorer 8 y Chrome.

La solución al final usar el otro Web Service que ofrece Geoserver, el WMS. En este Web Service es el mismo Geoserver (el servidor), el que hace unas imágenes jpg (o el formato que elijamos) con el mapa y los barcos pintados encima. Esta imagen se sirve al explorador cuya única tarea consiste en pintarla. Aun así, Chrome sigue funcionando perfectamente, mientra que con internet explorer ya se puede trabajar sin problemas, pero se le sigue notando más "pastoso" a la hora de mover el mapa y hacer zoom.

Una pena que al ser el navegador más usado por la gente profana, nuestro requisito sea que funcione bien con internet explorer.

Feb 18

Programando a ciegas

Nos ha caído un proyecto en el que nos toca hacer un portal web con mapa. Por ello hace tiempo me puse a jugar con GeoServer y OpenLayers. Pero ahora que nos ha caído realmente y me toca a mí desarrollar, llevo ya unos días programando y jugando en serio con estas herramientas, sobre todo con javascript y OpenLayers.

Por parte de GeoServer y OpenLayers he comenzado una serie de apuntes en la chuwiki sobre las cosas que voy descubriendo. Los enlaces a la chuwiki: GeoServer y OpenLayers.

Por otro lado he empezado con la programación en Javascript, lenguaje que nunca he usado más allá de alguna prueba simple, del que no tengo ni idea y del que ni siquiera conozco la sintaxis. Después de unos días de andar programando, buscando cómo hacer cosas concretas por Google, copy-paste, prueba y ensayo, ensayo y error y ver que las cosas misteriosamente funcionan o no funcionan sin tener muy claro por qué … me he decidido a empezar por donde debería haber empezado desde un principio: buscar un tutorial de javascript y leermelo, leerme la documentación de OpenLayers … e incluso la de jQuery, que también estamos empezando a usar.

No, si nunca aprenderé…. hay quien tropieza dos veces en la misma piedra y hay quien, como yo, se empeña en romper la piedra a cabezazos.

 

Oct 28

Geoserver, PostGIS y OpenLayers

mapa de geoserverÚltimamente estoy jugando con el tema de pintar mapas en web (aparte de la API de google maps). Buscando herramientas me he encontrado con el conjunto Geoserver, PostGIS y OpenLayers. Son herramientas independientes, pero que encajan muy bien las unas con las otras, facilitando mucho el hacer mapas en web.

PostGIS es un añadido a una base de datos Postgresql que permite almacenar información de mapas y cosas para dibujar en los mapas en un formato bastante estándar y que entienden muchas herramientas. En ella podemos crear nuestras tablas a medida, pero de forma que determinadas columnas, las que nosotros queramos, representen la información geográfica en un formato determinado. Por ejemplo, podemos hacer nuestra tabla de aviones con todos sus datos y en una columna poner su posición y altura en un formato específico de PostGIS. En otra tabla geometry_columns, específica de PostGIS, sólo debemos hacer una entrada indicando el nombre de nuestra tabla aviones, cual es la columna con las coordenadas y el tipo de figura que hay ahí (en este caso, punto en 3D, aunque podríamos tener polígonos, líneas y otras formas geométricas).

GeoServer es un servidor web de mapas, que puede arrancarse aislado o bien sobre un Tomcat o similar. GeoServer tiene una interfaz de administración web en la que podemos definir capas de datos, por ejemplo, una imagen de mapa de fondo cogido de un fichero, o un mapa vectorial cogido de algún fichero o de una base de datos, o una capa de aviones cogida de la base de datos PostGIS. En este último caso, simplemente dando los parámetros de conexión con la base de datos, GeoServer consultará la tabla geometry_columns para identificar qué tablas de base de datos tiene datos georreferenciados y nos las mostrará, para que elijamos que queramos. Para cada capa podemos definir estilos de presentación, tipos de líneas, de marcas.

OpenLayers es una librería javascript que es capaz de conectarse con GeoServer (o con otras fuentes de mapas, como google maps), para presentar en nuestro navegador las capas que elijamos de nuestro servidor de mapas/datos. En cuatro líneas podemos presentar el mapa, tenemos zoom, arrastrar, click sobre las entidades que aparezcan en el mapa, etc, etc. Puedes ver ejemplos en http://openlayers.org/dev/examples/

El problema el de siempre, o lees un montón de documentación, o empiezas con copìa ejemplo, pega ejemplo, ensayo y error. La documentación de GeoServer se basa mucho en ejemplos. Así que las cosas van saliendo, pero también tienes pequeños tropezones que te pueden hacer echar la tarde entera para resolver algo que luego es una chorrada. Hoy, por ejemplo, he echado la tarde intentando que se vean dos capas simultáneamente, una de fondo con un mapa y otra encima con puntos. El problema es que la una tapaba a la otra y no sabes si la transparencia de la de encima debes conseguirla en GeoServer o en OpenLayers. Al final fue pasándole desde OpenLayers un parámetro a GeoServer cuando se pide la capa….