Related Plugins and Tags

QGIS Planet

Leaflet, Stamen Toner and QGIS Server – An Intro

Today’s post is a note-to-self on how to set up a really quick little Leaflet web map with Stamen’s “Toner” background and a WMS overlay served by QGIS Server.

Note the use of the map parameter when creating the QGIS Server WMS layer.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-language" content="en" />

<title>Leaflet, Stamen Toner and QGIS Server</title>

<link rel="stylesheet" href="http://leaflet.cloudmade.com/dist/leaflet.css" />
<link rel="stylesheet" href="my.css" type="text/css" />
 <!--[if lte IE 8]><link rel="stylesheet" href="http://leaflet.cloudmade.com/dist/leaflet.ie.css" /><![endif]-->

<script type="text/javascript" src="http://leaflet.cloudmade.com/dist/leaflet.js"></script>
<script type="text/javascript" src="http://maps.stamen.com/js/tile.stamen.js?v1.1.3"></script>
<script type="text/javascript">
function initialize() {
	var stamen = new L.StamenTileLayer("toner-lite");
	
	var myLayer = new L.TileLayer.WMS("http://10.101.21.28/cgi-bin/qgis_mapserv.fcgi", {
		map: "/usr/lib/cgi-bin/test/test.qgs",
		layers: 'mylayer',
		format: 'image/png',
		transparent: 'TRUE',
	});
	
	var map = new L.Map("map", {
		center: new L.LatLng(48.2,16.4),
		zoom: 13,
 		minZoom: 10,
 		maxZoom: 18,
		layers: [stamen,myLayer],
	});
}
</script>

</head>

<body onload="initialize()">
    <div id="map" class="map"></div>
</body>

</html>

With this my.css, the map will be displayed in “full screen”.

  div.map{
    display:block;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
  }

Update

You can test an extended live example at http://anitagraser.github.com/Webmapping-Sandbox/leaflet.html


QGIS Server on Windows7 Step-by-step

After my successful experiment with QGIS Server on Ubuntu, I took a shot at Windows7. These are my notes on installing QGIS Server following the instructions on the wiki.

Installation

Using OSGeo4W installer it is easy to install QGIS Server: Just mark qgis-server for installation from “Web” category (in the “Advanced” installation).

All other necessary packages will be selected automatically.

As mentioned on the wiki, the next step is to tell Apache which port number to use. Apache (2.2.14-4 from OSGeo4W) does not have any default IP/port set and it fails to start. To fix this, we need to edit the file

c:/osgeo4w/apache/conf/httpd.conf

and change

Listen @apache_port_number@

to our needs, e.g. to listen on port 80

Listen 80

The last thing I had to do to get QGIS Server working was to copy two files
libeay32.dll and ssleay32.dll
from C:\OSGeo4W\apache\bin
to C:\OSGeo4W\apps\qgis\bin.

The GetCapabilities request should work now

http://localhost/qgis/qgis_mapserv.fcgi.exe?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities

Adding a QGIS project file

To add a project file to the server, we stay in C:\OSGeo4W\apps\qgis\bin. If we put a project file in this directory, it will be served by default (without having to pass the optional map parameter).

For this test, I added my vienna.qgs project file. This is how my QGIS bin folder looks like (notice the .dll files we copied from Apache/bin and the project file):

Next, we have to restart Apache to force QGIS Server to load the project file. The OSGeo4W installation provides a handy “Apache-Monitor” GUI to restart Apache. If it fails, try to reboot ;)

Let’s test the setup using “Add WMS Layer” in QGIS by adding the service URL and ticking “Ignore GetMap URI …” and “Ignore GetFeature URI …”.

The project layers are now available through WMS and can be loaded into your client.

QGIS "Add WMS Layer" dialog with my newly created WMS

Conclusion

That wasn’t bad. The wiki page was very helpful and I didn’t encounter any real problems. Editing a config file and copying a few .dlls is easy enough.

Since linking files is not one of Windows’ strengths, I’d expect a server with multiple projects to get quite messy. But it certainly works for home use and experiments.


QGIS Server on Ubuntu Step-by-step

This post summarizes my notes about installing QGIS Server on Ubuntu, adding a QGIS project file to the server and using the WMS in an OpenLayers application.

Installation

First, it’s useful to figure out the Ubuntu version:

lsb_release -a

Since my server runs “lucid”, I add the following package sources to /etc/apt/sources.list (as described in the QGIS installation documentation)

deb http://qgis.org/debian lucid main
deb-src http://qgis.org/debian lucid main

Before we can install anything, we need to add the key and update the package list

gpg --keyserver keyserver.ubuntu.com --recv 1F9ADD375CA44993
gpg --export --armor 1F9ADD375CA44993 | sudo apt-key add -
sudo apt-get update

Now we can install QGIS Server and the necessary Apache package

sudo apt-get install qgis-mapserver libapache2-mod-fcgid

It never hurts to restart Apache :)

sudo /etc/init.d/apache2 restart

Let’s test the installation before we proceed. The GetCapabilities request should already work

http://10.101.21.28/cgi-bin/qgis_mapserv.fcgi?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities

Adding a QGIS project file

It’s time to add a QGIS project to our server. To do that, we move to the QGIS Server folder

cd /usr/lib/cgi-bin

where you should find qgis_mapserv.fcgi and wms_metadata.xml.
I’ve decided to have one folder for each project file. My first project is “vienna”.

sudo mkdir vienna
cd vienna

qgis_mapserv.fcgi and wms_metadata.xml can now be linked into this new folder

sudo ln -s ../qgis_mapserv.fcgi .
sudo ln -s ../wms_metadata.xml .

The only thing that’s missing anymore is a QGIS project file. It can be copied or linked into the folder. After restarting Apache, we should be good to go.

Let’s test the setup using “Add WMS Layer” in QGIS by adding the service URL such as

http://10.101.21.28/cgi-bin/vienna/qgis_mapserv.fcgi

and ticking “Ignore GetMap URI …” and “Ignore GetFeature URI …”.

After clicking “Connect”, all layers from the project file we added should get listed and we can select and load them.

QGIS Server can serve as many project files as you want. There a different ways to organize your server but I would simply add a new folder (like the “vienna” folder in this example) and link in the executable and project file.

Using QGIS Server WMS in OpenLayers

Of course QGIS Server doesn’t just talk to QGIS Desktop but to any other WMS client that conforms to the standard. One classic use case is to add the WMS layers to an OpenLayers application. This is rather simple but I’ll add it here for the sake of completeness:

I used to have a Geoserver WMS base layer in my application. The only lines of code that needed to be changed to migrate to QGIS Server were the service URL and the layer names.

    wms = new OpenLayers.Layer.WMS(
        'roads', "http://10.101.21.28/cgi-bin/vienna/qgis_mapserv.fcgi",
        {
            layers: 'roads', 
            format: 'image/png';
            bgcolor: '#fafafa'
        }, 
        {
            buffer: 1, 
            isBaseLayer: true, 
            graphicZIndex: 0, 
        }
    );

Standardized services are great!


Back to Top

Sustaining Members