.. _tinyows_openlayershowtobasic:
*****************************************************************************
Sample: WFS with TinyOWS and OpenLayers
*****************************************************************************
0) Install PostGIS and TinyOWS (:ref:`tinyows_serverinstallation`)
1) Within PostGIS, create a spatial database called 'france'
.. code-block:: bash
createdb -U postgres france
createlang -U postgres plpgsql france
psql -U postgres -d france < `pg_config --sharedir`/contrib/postgis-1.5/postgis.sql
psql -U postgres -d france < `pg_config --sharedir`/contrib/postgis-1.5/spatial_ref_sys.sql
2) Import France data into your PostGIS database
.. code-block:: bash
wget tinyows.org/tracdocs/release/france_data.tar.gz
tar xvzf france_data.tar.gz
cd world
shp2pgsql -I -s 27572 france.shp france | psql -U postgres -d france
3) Configure TinyOWS by editing /usr/local/tinyows/config.xml
.. code-block:: xml
4) Test your installations of TinyOWS and PostGIS
.. code-block:: bash
./YOUR_CGI-BIN_PATH/tinyows --check
Config File: OK
PG Connection: OK
Available layers:
- public.france -> 27572 R
5) Install OpenLayers
.. code-block:: bash
wget http://openlayers.org/download/OpenLayers-2.9.tar.gz
tar xvzf OpenLayers-2.9.tar.gz
mv OpenLayers-2.9 /YOUR/SERVER/HTDOCS/
6) Install the OpenLayers proxy (you need the Python interpreter to make it work)
.. code-block:: bash
cp OpenLayers-2.9/examples/proxy.cgi /YOUR/SERVER/CGI-BIN/
7) Add localhost (or your server IP) to proxy allowedHosts (/YOUR/SERVER/CGI-BIN/proxy.cgi)
.. code-block:: bash
allowedHosts = ['127.0.0.1', 'www.openlayers.org', 'openlayers.org', ... ]
8) Create a new file at OpenLayers-2.9/examples/tinyows.html :
.. code-block:: html
WFS Basic with TinyOWS and GeoJSON
WFS Basic example with TinyOWS, using GeoJSON.
Shows the use of the WFS Basic with TinyOWS Server, using GeoJSON.
WMS base layer is GeoSignal one.
Vector datas are GeoFLA Departements (IGN).
Size of datas are about 800 Ko (either Shapefile or GeoJSON).
Right now it's the top limit that OpenLayers can decently handle.
9) Create a new file at OpenLayers-2.9/examples/tinyows.js
.. code-block:: javascript
var map;
OpenLayers.ProxyHost = "/cgi-bin/proxy.cgi?url=";
function init() {
map = new OpenLayers.Map('map', {
projection: new OpenLayers.Projection("EPSG:27582"),
units: "m",
maxResolution: "auto",
maxExtent: new OpenLayers.Bounds(5000,1620000,1198000,2678000),
controls: [
new OpenLayers.Control.PanZoom()
]
});
var base = new OpenLayers.Layer.WMS("OpenLayers WMS",
"http://www.geosignal.org/cgi-bin/wmsmap?",
{layers: "Regions,Departements",
projection:"EPSG:27582",
units: "m",
maxResolution: "auto",
maxExtent: new OpenLayers.Bounds(5000,1620000,1198000,2678000),
sld: "http://www.tinyows.org/tracdocs/demo/OpenLayers-2.9/examples/sld.xml"
}
);
map.addLayer(base);
var wfs = new OpenLayers.Layer.Vector("Countries", {
strategies: [new OpenLayers.Strategy.BBOX()],
projection:"EPSG:27582",
protocol: new OpenLayers.Protocol.WFS({
url: "http://www.tinyows.org/cgi-bin/tinyows?",
featureType: "france",
featureNS: "http://www.tinyows.org/",
outputFormat: "application/json",
readFormat: new OpenLayers.Format.GeoJSON()
})
});
map.addLayer(wfs);
map.zoomToExtent(new OpenLayers.Bounds(5000,1620000,1198000,2678000));
}
10) You should obtain an image similar to the one below. Live version is at
http://tinyows.org/tracdocs/demo/OpenLayers-2.9/examples/tinyows.html
.. image:: ../images/tinyOWS-WFS.png