I’ve added some new features to our Ordnance Survey map of the Peak District which shows local tracks. This brings it from version 2 to version 2.5.

New Features

• View URL encoded routes
• Users can add a customisable Marker and share it using a URL
• Search by place names, post codes or OS Grid References (6 or 8 figure)
• Easier sharing of locations, tracks and built in routes; using URLs
• Better layout
• Link to a map legend (key)

URL encoded routes are the first step in our plan to let users design and share routes using our map. Not only that but you’ll be able to draw a 20 mile route in under a minute! Sounds too good to be true, but I’ve come with a special system that I haven’t see used anywhere else. The route designer is still in development, but this version of the public map allows you to view what we create, eg routes of rides we’ve been or are planning. Hopefully the next public version will have the route designer in it, but that depends on how well the development goes.
All the information for the route is encoded in a hyperlink which means we avoid the tricky business of letting people store routes files on our server or in our database, but still lets you share them in an easy way. (Unfortunately VERY long routes will not be compatible with Internet Explorer which limits URLs to ~2040 characters (cos it’s crap), but I have done everything I can to shorten the encoded length.)

Example: Boxing day route, with a custom marker with an image.

To make a Custom Marker, click ‘position’ and the click anywhere on the map to place it, then click its icon and enter your text and optionally the URL address of an image (eg a thumbnail of one your pictures on Facebook), then click Save. The information has been stored in the ‘Link’ in the sidebar, click it to view your marker in a new window, you can share this with anyone by sending them the link (by copying it from the address bar, or right click ‘Link’ and choose Copy Link Location or Copy Shortcut). If you know HTML tags you can use them in the text box for links etc.

You are welcome to leave comments with feedback or suggestions for future features below.

Taken on today’s Christmas Eve ride.

Eight months ago we brought you a Ordnance Survey map of the local mountain biking tracks, I’ve now finished work on Version 2.

New features include:

• Larger map view – The map will stretch as big as your screen goes. (Press F11 to have your browser view it full screen.)
• Routes!!! – Not many so far, but new ones aren’t to hard to add.
• ‘Services’ locations – Places that useful to MTBer visiting the area.
• Track Menu – Click to go straight to a Track.
• Other view links – As well a link to 1:25K OS map there is now a Google Map Satellite link.
• Location URL shortcuts – You can link directly to a Track, Route or Grid Reference.
• Improved IE compatibility (kind of) – The Track lines show properly, but the bottom menu doesn’t fully work, sorry.

How to use URL Shortcuts
Slightly geeky but still not too hard. The easiest is a for a grid reference, just add “?g-” then the grid reference on the end of the URL. e.g. To go to Win Hill add “?g-SK187851” (without the quotes).
For tracks add “?t-” and the track name in lower case with dashes instead of spaces.

We’d like to add more descent Routes, so let us know if you’ve got any good ones you’d like to share. If you’ve got any suggestions for improvement or new features leave a comment below. Future improvements should hopefully be; full compatibility for IE, search box for Grid Refs (maybe places & postcodes too) and easier to use URL shortcuts.

Well it’s taken me a while but we have an interactive Ordnance Survey map in the Tracks page showing the track locations and links to the relevant pages. View the map

Operation & Features – You can operate it by using the buttons in the top left, or click and drag with your mouse to pan and use the scroll wheel to zoom (while the cursor is over the map). Below the map a 6-figure grid reference of cursors current (or last) position is shown. Since the map zoom level can only go to 1:50,000 (1:50K), there is a link to open an OS Get-a-map(^TM) 1:25,000 (1:25K) using the Grid Reference from the centre of the map (that’s more detailed scale). On the map you should see red circles, these show the top of a track and clicking on them brings up small info note with a link to our Track page for it, two preview pictures and its ratings.

Limitations (Enter IE) – Having overcome many problems and ‘puzzling and puzzling ’til my puzzler was sore’, I finally got it working and then got it into the main part of the site (which was almost twice the work again). It works great in Firefox2, Firefox3 brings up a message about rendering (that one’s nothing to do with me) but should work fine, Internet Explorer 7 seems to show the map but not the red markers or route lines – UNLUCKY! – for now…
I have limited the map area to the Peak District, and the map system can only zoom to 1:50,000 (that’s the maps with red coloured rights of way), I also note more out dated than the 1:25K not showing some permissive bridleways and there’s no Open Access land.

Future Plans

• It wouldn’t be that hard to show a ride route and calculate the length automatically, so we’ll probably use it for showing the route when we plan a ride.
• Having a box to enter a grid reference would be useful and shouldn’t be too hard.
• It would cool to integrate the Google maps aerial view into the map.
• Letting members use it to post routes is potentially possible, but probably a long way off and there are already sites for that purpose using the same map technology.
• Write more Track pages so we can put more on the map!

How It Works – I didn’t write the map code, it uses the OS Openspace API which is a bit like Google maps, but it’s an OS map so it’s actually useful outside a town. It displays 9 tiles (map images) at a time (there is a limit to the number a site can use in a day) and it use Javascript.

A short tech guide to using OS Openspace in Wordpress
I created a html version first from the examples on the OS Openspace site and got it working in that first. When I had markers with popups and then added lines I found the popups stopped working, this was because some of the examples are wrong eg:
var vectorLayer = new OpenLayers.Layer.Vector("Vector Layer");
osMap.addLayer(vectorLayer);
Since a vector layer has already created by default, it should be:
var vectorLayer = osMap.getVectorLayer();
For getting it into Wordpress (which doesn’t like Javascript in posts and pages) I have the javascript in an external file and am calling it for one page using this method. Don’t forget to call the main OS hosted script first (using YOUR access key). But the call to main initialisation function has to come after the Map Div otherwise the it won’t see the Map Div. Using the Error Console in Firefox can help a lot with fault finding the problems. I got the very handy code for converting between 6 figure grid references from this well made map page.