[OSM-dev] OSMWidget - OpenLayers based map widget for clickable and editable POIs

Nick Whitelegg nick at hogweed.org
Wed Mar 26 10:33:04 GMT 2008


Hello everyone,

As part of the "osmwiki" demo app (see talk list on OSM) I have developed an 
OSMWidget JavaScript class which can be installed on any OSM-based site with 
a planet-based PostGIS database plus a few PHP scripts (see below) to add a 
slippy map with annotatable POIs and search functionality.

It's available at:

http://www.free-map.org.uk/freemap/javascript/OSMWidget.js

You need a few supporting JavaScript files:

http://www.free-map.org.uk/freemap/javascript/lib/converter.js
http://www.free-map.org.uk/freemap/javascript/lib/jscoord-1.0.js (note 
licence)
http://www.free-map.org.uk/freemap/javascript/lib/Dialog.js


You also need to install a few PHP scripts to handle the interaction with the 
database: they are at

http://www.free-map.org.uk/downloads/osmwidget_php.tar.bz2

An example of its usage is in the init() function at

http://www.free-map.org.uk/freemap/osmwiki/index.php

To summarise, the constructor takes these parameters - it may sound rather a 
lot, but I've tried to make it as reusable and flexible as possible:

- an OpenLayers.Map;
- an initial latitude (standard WGS84 lat/lon, converted to mercator 
internally)
- an initial longitude (ditto)
- an initial zoom
- the ID of a <div> or similar to place search results
- the ID of the text field for searching;
- the ID of the button that the user clicks when they enter a search term;
- the URL of the PHP script which handles adding/editing POIs in the database 
(the POInotes.php script in the download, above)
- the URL of the PHP script which generates the simple "wiki" pages on POIs 
(the POIgeneral.php script in the download, above)
- the URL of the main map page.

Nick




More information about the dev mailing list