Book Image

Instant OpenLayers Starter

Book Image

Instant OpenLayers Starter

Overview of this book

OpenLayers is an open source JavaScript web mapping library distinguished from other alternatives, like Leaflet or Google Maps APIs, because of its huge set of components. Having being on the scene for a long time, users can benefit from a large set of resources and documentations, and a wide and actively supportive community.Instant OpenLayers Starter gives you the possibility to produce your first “real” web map without being an experienced programmer or a GIS specialist. It provides you with an overview of the most popular vector and raster data formats used to share spatial information on the Web. By the end of the book you will be able to amaze your boss with a brand new web map and a bag of skills to give life to your geodata.Instant OpenLayers Starter guides you through a fast and effective journey of web mapping, to discover how easy it is to put maps in your web projects, from simple base maps to interactive geo mash-ups, Google Maps, OpenStreetmap, GeoRSS, Panoramio, and your data. Starting with a lot of geo-information sources and a powerful library, we will explore how to manage maps inside web pages using basic third-party base maps to the overlay of re-projected vector data, going through styling thematic data and data interaction.
Table of Contents (7 chapters)

Installation


In four easy steps, you will install OpenLayers and start creating your amazing web maps.

Step 1 – What do I need?

OpenLayers is a JavaScript library designed to build web maps, so you must be familiar with the most popular technologies used to create web applications. Basic knowledge of JavaScript and HTML is a prerequisite, while an understanding of CSS is not necessary but convenient.

You can write the recipe's code in a simple text editor, but as an alternative, you may consider an IDE (Integrated Development Environment) that provides you with a complete development framework. In this category, we would recommend Aptana Studio 3, an open source, cross-platform IDE with the support for JavaScript, HTML, and CSS. It offers code assist, integrated debugger, and much more. Aptana Studio 3 is available at http://www.aptana.com/products/studio3.

For Windows users, Notepad++ is a very good choice. It is not an IDE, but it is more than a simple text editor and offers syntax highlighting and plugins that are easy to use. It is an open source project, freely available at http://notepad-plus-plus.org.

The authors of this book have adopted the very popular GNU/Linux distribution called Ubuntu as their principal operating system. You may work smoothly even in a Windows or Mac OS X environment, but it would be more comfortable for you to use an Ubuntu system to follow the entire installation process step by step.

Note

If you are unfamiliar with JavaScript, HTML, and CSS, the resources on the Mozilla Developer Network at https://developer.mozilla.org/en/docs/ may be helpful.

You can download Ubuntu at www.ubuntu.com and install it natively on your hard drive as the native operating system, or use a virtual machine such as VirtualBox, available at http://www.virtualbox.org.

Step 2 – Downloading OpenLayers

The latest stable build of OpenLayers is available as a .tar.gz or .zip archive from the homepage of the project at http://www.openlayers.org/. Choose one format and download the latest stable release of the library (2.12 at the time of writing this book).

Step 3 – Unpacking OpenLayers

After downloading the archive, you need to unpack it to be left with a directory called OpenLayers-2.12, containing a number of files and folders. Now, you just need to create an empty folder in your /home, name it openlayers_starter, and copy the library into it.

This will be your workspace for all of the recipes and in the next (and last) step we will see where to put it to start having fun with OpenLayers.

Step 4 – Serving the library

OpenLayers is a pure client-side JavaScript library, but in a production environment, JavaScript web applications are distributed through web servers, so it is a good idea to start becoming familiar with this concept. Moreover, in some recipes, we will need to pass a proxy script to retrieve remote data and this requires a web server to be run. So, as final step, you will install and configure a minimal publishing environment on your machine with Apache 2, a very popular open source web server. Its installation in Ubuntu is easy as a pie!

Launch a terminal and type the following into it:

~: sudo apt-get install apache2

Then, in the same terminal, after the first command finishes, type the following:

~: sudo chown -R ${USER} /var/www; ln -s /var/www /home/${USER}/www

Let's explain. The first line performs the actual installation. The second line changes the owner of the web server's root directory to your user, and then creates a soft-link to it.

Go to http://localhost with your browser. If the installation succeeds, the Apache 2 web server welcome page opens and displays the message "It works!".

Now, as very last thing, move the openlayers_starter folder into www.

Note

Windows users can download Apache 2 at http://httpd.apache.org/ and install it in few steps or choose between a number of ready-to-run environments for web development such as BitNami (http://bitnami.org/).

And that's it!

By this point, you should have a working installation of OpenLayers and be free to play around and discover more about it.