Developing with OS OpenSpace on multiple URLs
This question was recently asked by @skipchris. As anyone who has signed up to develop with OS OpenSpace has discovered, the API required the use of an API key. This key is tied to the URL the developer registered. This means that if I registered my site URL in OS OpenSpace as www.mydomain.com, my application would only work when hosted on www.mydomain.com.
However, the API key allows you to develop on localhost as well. What this means is that during development I can run a webserver on my local computer and assuming that I can run my application as http://localhost, my API key will be valid, as well as on the registered domain.
For example, I could develop an application in Web Map Builder, save it to a file called “myapp.html”. Assuming I have a local webserver, this application would work on both localhost and on the domain I registered:
http://localhost/myapp.html
and
http://<my_OS_OpenSPace_Registered_Domain>/myapp.html
So what happens if I wish to change my registered domain?
Simply drop the OS OpenSpace team an email detailing the URL you wish to change to, along with your API key and this can be sorted for you.
Adding Markers to an OS OpenSpace map from a database
Using Web Map Builder for OS OpenSpace is great way to get your first map on your site. However, many users wish to go further than that and place items on OS OpenSpace from a file or database.
Here I’ll cover how to draw markers from a simple database.
This clinic will go through how I produced this map, for which the code can be found here.
frameborder="”0″" scrolling="”auto”" name="”oswebmapframe”">
Firstly, there are a couple of points to note:
- I’ll only be displaying markers, no reason why this couldn’t be extended to other feature types.
- My database has only a few points. If you have a very large number of features (over a couple of hundred), you may wish to try a different strategy. Why? Basically, with the method illustrated below, all the markers are loaded into the browser and after a couple of hundred the browser becomes sluggish. I’ll cover what to do with many thousands of markers/points in a later clinic.
- We’ll be using PHP to retrieve the database values. PHP is a server-side scripting language, ideal for what we want to do.
- The database does not use spatial feature types, just simple X and Y columns.
- The example assumes that the coordinates stored are in the OSGB coordinate system.
So, before I can display anything I’ll need:
- A database with some data in it. Today my database of choice is MySQL.
- An OS OpenSpace map to display my markers on.
First, the database. My example is very simple. I have a single table with the following columns: X ,Y, text and ID
It has some simple data in it:
The critical steps I used to make markers from this database on my OS OpenSpace map are as follows:
1. Open a connection to the database:
$user_name = “*******”;
$password = “*******”;
$database = “*******”;
$server = “*******.mysql”;
$db_handle = mysql_connect($server, $user_name, $password);
$db_found = mysql_select_db($database, $db_handle);
2. Select all the records in the bee_marker table:
$SQL = “SELECT * FROM bee_marker order by id;”;
3. For every row returned from the query, construct the usual create Marker function using the X and Y coordinates for the position and the text for the information bubble:
while($row = mysql_fetch_array($result)){
$x = $row['X'];
$y = $row['Y'];
$text = $row['text'];
$id = $row['id'];
echo “pos = new OpenSpace.MapPoint(” . $x . “,” . $y .”);n”;
$textdec = html_entity_decode($text);
echo “var beeicon = new OpenSpace.Icon(‘bee-marker.png’, size, offset, null, infoWindowAnchor);n”;
echo “content = ‘” . $textdec . “<br><a href=”mailto:ian.holt@ordnancesurvey.co.uk?subject=BeeGardens%20Moderator%20Report
%20for%20marker%20″ . $id . “.”>Report Problem</a>’;n”;
echo “osMap.createMarker(pos, beeicon, content, new OpenLayers.Size(500, 200));n”;
}
Next time, if you’re interested, I could extend this example with code on how you could place their own markers and information on the map.
Comments (3) 
Themocracy