Ivanković D., Vučić I. (2011). Web presentation of GIS objects on institute of oceanography and fisheries using open source/free tools (OpenLayers & GeoServer). In: D. Kereković, R. Źróbek (ed.). The Future with GIS. Croatian Information Technology Association GIS Forum, University of Silesia, Zagreb, 197-204. WEB PRESENTATION OF GIS OBJECTS ON INSTITUTE OF OCEANOGRAPHY AND FISHERIES USING OPEN SOURCE/FREE TOOLS (OpenLayers & GeoServer) Damir Ivanković, Ivan Vučić Institute for Oceanography and Fisheries Šetalište I. Meštrovića 63, 21000 Split, Croatia Introduction One of the tasks at Institute of Oceanography and Fisheries is to find the way to present the data to public. Some of those data are fisheries regulations, water bodies, stations and monitoring results. Since many of them are stored in web oriented database that we ve been developing for the last 9 years, web oriented GIS was next logical step in their presentation and management. Web environment today becomes standard and best way for communication with users. Also in fast growing market of various smart mobile devices, with web application, only standards to follow are HTML standards and you application is widely accessible. JavaScript is part of HTML standards and can be used onto all platforms (with Adobe Flash for example this is not the case). Plan was to implement reliable web service, with good documentation and many references. At Institute we have experience with some commercial ESRI products, also we have some existing web services (Content Management System) based on open source / free solutions. Our entire existing web services work on Linux operating systems which prove you self as leading platform for web services. Implementation of commercial web services require not only additional cost for license, but also use of some commercial courses for installation and implementation. Open source / free solutions don t have license cost and there is many ways to find documentation and examples at the Internet. So we decide to choose open source / free solutions. System components As server platform we choose CentOS 5, Linux operating system. CentOS 5 we already use at Institute as platform for database, database application server and Content Management System (CMS). CentOS is a community-supported, mainly free software operating system based on Red Hat Enterprise Linux (RHEL). It exists to provide a free enterprise class computing platform and strives to maintain 100% binary compatibility with its upstream distribution. CentOS stands for Community ENTerprise Operating System. CentOS is the most popular Linux distribution for web servers with almost 30% of all Linux servers using it. For GIS publishing software we choose GeoServer, because of good references and easy implementation. GeoServer is running under Tomcat 5 application server. Apache Tomcat (or Jakarta Tomcat or simply Tomcat) is an open source servlet container developed by the Apache Software Foundation (ASF). Tomcat implements the Java Servlet and the JavaServer Pages (JSP) specifications from Sun Microsystems, and provides a "pure Java" HTTP web server environment for Java code to run. GeoServer allows users to share and edit geospatial data. Designed for interoperability, it publishes data from any major spatial data source using open standards. GeoServer has evolved to become an easy method of connecting existing information to Virtual Globes such as Google Earth and NASA World Wind as well as to web-based maps such as OpenLayers, Google Maps and Bing Maps. GeoServer functions as the reference implementation of the Open Geospatial Consortium Web Feature Service standard, and also implements the Web Map Service and Web Coverage Service specifications. GeoServer is open source free software. We install prepared rpm package of GeoServer prepared for CentOS 5 by OpenGeo. OpenGeo is commercial company using open source products for commercial projects. As part of OpenGeo suite there is GeoServer. Usage of this GeoServer package is free, and OpenGeo company make many of OpenGeo suite, trainings and implementations. 197
Picture 1: Implementation schema About GeoServer Being a community-driven project, GeoServer is developed, tested, and supported by a diverse group of individuals and organizations from around the world. GeoServer s transactional capabilities offer robust support for shared editing. GeoServer s focus is ease of use and support for standards, in order to serve as glue for the geospatial web, connecting from legacy databases to many diverse clients. Some of standards / clients are: OGC-compliant Web Map Service (WMS 1.1.1 and 1.3.0), Web Feature Service (WFS 1.0.0 and 1.1.0), WFS-Transactional (WFS-T 1.0.0), and Web Coverage Service (WCS 1.0.0 and 1.1.1) Java J2EE application, works with Jetty, Tomcat, WebLogic, WebSphere, JBoss Support for many back-end data formats (ArcSDE, Oracle Spatial, DB2, SQL Server, shapefile, GeoTIFF, MrSID, JPEG2000) Multiple output formats (GML, shapefile, KML, GeoJSON, PNG, JPEG, TIFF, SVG, PDF, GeoRSS) plus Google Earth integration Fully-featured and intuitive web administration interface with REST API for programmatic control Full map styling support with Styled Layer Descriptor (SLD), including text-based and graphical editor User- and role-based security subsystem based on Spring Security 198
Some of supported client and server software: Open Source Database: PostGIS, MySQL, H2 Open Source Client: OpenLayers, udig, gvsig QGIS, WorldWind Proprietary Database: ArcSDE, Oracle Locator / Spatial, SQL Server 2008, DB2 Proprietary Client: ArcGIS, Google Earth, Virtual Earth, Safe FME, CadCorp SIS Picture 2: GeoServer web interface Java script libraries For displaying GIS content, described system use various Java script libraries. Java script libraries are predefined JavaScript functions packed together with visual CSS components for advanced web content presentation. Advantage of this conception is that most of processing power required for user - system interaction comes from client side, JavaScript functions are running inside client web browser. For ours web application we choose to use these JavaScript libraries: OpenLayers Ext JS GeoExt OpenLayers is a pure JavaScript library for displaying map data in most modern web browsers, with no server-side dependencies. OpenLayers implements a JavaScript API for building rich web-based geographic applications, similar to the Google Maps and MSN Virtual Earth APIs, with one important difference OpenLayers is Free Software, developed for and by the Open Source software community. Ext JS (ee-x-t JS) is a JavaScript library for building interactive web applications using techniques such as Ajax, DHTML and DOM scripting. Originally built as an add-on library extension of YUI by Jack Slocum, Ext includes interoperability with jquery and Prototype. Beginning with version 1.1, Ext retains no dependencies on external libraries, instead making their use optional. GeoExt is a JavaScript library that provides a groundwork for creating rich web mapping applications. It combines the web mapping library OpenLayers with Extjs, "a cross-browser JavaScript library for building rich Internet applications." GeoExt provides a suite of customizable widgets and data handling support that makes it easy to build applications for viewing, editing, and styling geospatial data. Some of features are: 199
Built with Ext JS, cross-browser rich Internet application framework Integrated OpenLayers mapping client Full dynamic user interactivity and animation without the need for Flash or Silverlight Well designed and extensible component model Wide variety of generic widgets (grids, charts, trees, layouts, combo boxes, toolbars) Flexible, standards-based mapping widgets like legends, pop-ups, and scale choosers Printing controls from PDF serving platform, such as page layouts, resolution, and legends Customizable layer selection GeoExt Applications GeoExt makes it easy to build web mapping applications like the ones below: Styler: An interactive styling application for geospatial data. GeoExplorer: A tool for browsing geospatial data on the web Storage of spatial data GeoServer can store geospatial data in two basic ways: onto file system as files and into external database. For the beginning we store our data into file system. For the future development we plan to use relational database to get better service performance. At the Institute we use Oracle 10.2 database. GeoServer does not come built-in with support for Oracle; it must be installed through an extension. Oracle extension is available for download from GeoServer web page. Once the extension is properly installed Oracle will be an option in the Vector Data Sources list when creating a new data store. With vector layer stored in database we have possibilities for dynamically created data. For example this layer can show measuring stations depending of user query. 200
Managing layers During the first stage of development of our web GIS application, we've decided to use ESRI shapefiles as base for our map layers. First step was to upload shapefiles on map server (GeoServer) and define each layer that would be presented on our map. Defining a layer means defining the store (shapefile) from which this layer will be created and its style. Style is described inside.sld file, an xml type of file, which enables us to define all the characteristics of a layer. SLD stands for Styled Layer Descriptor. It is an open standard of rules for rendering of maps. Think of it as CSS for maps: it controls the colors, line widths, strokes, labels, varying them according to scale and attributes of the data. Style can be crated manually, using plain text editor, or with Styler, a graphical SLD editing application integrated inside GeoServer. At this point we decided to use Styler which will speed up the process. Picture 3: web text editor for manualy editind sld file Picture 4: editing sld file using Styler application Projections harmonization Map projection is a representation of the entire, or parts of a surface of a three dimensional sphere on a two dimensional plane. No map is a perfect representation of the earth, they all have some distortions. Depending on what of the attributes you want to preserve, you choose your projection. Projection that we used for our layers is WGS84 lat/long (EPSG:4326). Since we ve decided to use a commercial third party mapping APIs (OpenStreetMap, GoogleMaps, VirtualEarth, Yahoo! Maps) as base layer of our map, which all use projection know as Spherical Mercator projection (EPSG:3785, or EPSG:900913), we had to reproject our layers into this projection. So we ve defined (inside GeoServer layer definition process) that projection that our layers will be presented in, when application generates a WMS request, is Sperical Mercator. This is important because the result of WMS request is georeferenced image, which cannot be reprojected inside OpenLayers. Repojection is done automatically by Geoserver upon each WMS request. If we use own base layer it is still good to use Sperical Mercator projection because users are used to this projection (other projections can be weird for them). Next step was defining new projection (Sperical Mercator) inside OpenLayers. By default, a map inside OpenLayers is in WGS84 lat/long. This way our map will be in this new projection and we can line up all the layers inside it (base layers and layers retrieved from GeoServer). 201
Picture 5: Projection and controls example using OpenLayers (and javascript code of this example) OpenLayers example In the example from Picture 5 there you can see some important features of OpenLayers as: Language customization for strings from controls (OpenLayers.Lang.setCode) Definition of base layers for Google maps, Bing maps and Open Street Map (EPSG definitions, map style definitions, bouns definitions examples) Definition of control panel and adding various controls (move tool, zoom tool, zoom history) Definition of custom reprojected overlay (EPSG definition, WMS call example, format definition, bounds definitions) 202
Picture 6: GeoExt example with multiple basic layers, multiple overlays and interactive legend GeoExt example Picture 7: GeoExt javascript code example In the example from picture 6 there are three ours overlays and four base layers. Layer control is possible thought interactive tree legend. Also previous, next zoom step controls are available. We also added control that shows mouse pointer position inside the map panel. Coordinates are shown in the right bottom corner of the map panel. 203
Conclusion Open source / free software and tools for web GIS services installed at Institute of Oceanography and Fisheries and presented in this paper fulfill our needs for such services. Web applications produced with this tools are quick, robust, nice looking and easy to use. Defining our own base layer will resolve the dependency on third party map APIs (GoogleMaps, Virtual Earth, Yahoo Maps, OpenStreet Maps) and that is next stage in application development. This, alongside with vector layers stored in spatial database and tool for easy presentation of our GIS products that we already have, would make a powerful GIS web application that will be able to resolve any task given to us. References 1. http://en.wikipedia.org/wiki/centos 2. http://en.wikipedia.org/wiki/apache_tomcat 3. http://en.wikipedia.org/wiki/geoserver 4. http://geoserver.org/ 5. http://opengeo.org/technology/geoserver/ 6. http://en.wikipedia.org/wiki/openlayers 7. http://openlayers.org/ 8. http://en.wikipedia.org/wiki/ext_js 9. http://www.geoext.org/ 10. http://opengeo.org/technology/geoext/ 204