adding ordnance survey maps to your website

You can add Ordnance Survey maps to your website. This is very handy if, like me, you want to produce posts on walking. I contacted Ordnance Survey about the possibility of using maps on my website and received a very helpful reply by a customer service advisor.

The place to begin is at “OS Openspace: Interactive maps for your website or online app”. You are given three options: (1) OS OpenSpace API (Application program interface), OS OpenSpace Pro and OS OpenSpace SDK (software development kit)

Now as building this website is a bit of a hobby but I would like to include a few adverts. Then I have opted for the OS OpenSpace API. To quote from the email that I received from OS:

“OS OpenSpace – this is a free api service which allows you to embed mapping in your website, provided that the website is non-commercial and is publicly accessible (not password restricted): https://www.ordnancesurvey.co.uk/business-and-government/products/os-openspace/index.html. 1:50 000 scale is available via this option. ”

So whilst it would be really handy to be able to display 1:25,000 OS “Explorer” maps on my website I am appreciative that I am able to use the 1:50,000 OS “Landranger” maps for free. The above link has, under “Why choose OS OpenSpace API”:- “Subject to fair-use limits, it’s free and you may display ads on the page”. As an impecunious web developer I do appreciate this facility.

First I will show you how to get a map from the OS OpenSpace Web Map Builder page. Then I will show you how to get an API key, in order to get a map, from the OS OpenSpace Web Map Builder page. Seems back to front but, trust me, it is easier to explain the process this way.

The OS OpenSpace Web Map Builder page looks like this:

You can see that you need to register in order to get a username and password in order to use this site. As I say, I will come to that. (press CTL and + on your browser if you need to zoom in on my website)

What you do is click on the map and find where it is you want the map of. You can use your mouse scroll wheel to zoom in, on this OS map. The standard 1:50,000 Landranger scale is available:

You CAN zoom in further to get details of roads and streets, but in open areas, you won’t get public rights of way, footpaths, field boundaries, or contour lines, etc, that you would get on the 1:25,000 Explorer maps. I will mention the current premium rates, to get Explorer maps, later too.

Now you can add markers, add routes etc and the resultant HTML code gets quite long. So for the purposes of demonstation I will leave all these options and just move on to showing you the code. So Click on Step 4 “Generate and save code”. It then says “If you’re happy with the map on the left then collect your code.” You click the “Collect code” button.

Your HTML code, for your selected map (without an API key) , looks like this:

You need to select your map, put in the route and way markers etc, and generate the code, whilst you are logged in. In that way the code will contain your API key, and then it will, after some configuration, which I will explain, actually work in your website 🙂 . You can just highlight the code and copy it to a text file for now, it is just text.

To get your API key go back to “OS Openspace: Interactive maps for your website or online app”. And, on the right, where it says “Get your API key” and click on “Sign up now”. Be sure to read the Terms and Conditions. Says things like “You must have ‘© Crown copyright 2013’ as a caption on all OS maps”. But that comes as standard on the maps. “You must ensure that the OS OpenSpace logo to include ‘powered by OpenSpace’ “. Again, that comes as standard. You must accept the Ts&Cs and fill in the usual random letters to ensure that you are not a robot. You then receive an email with your API key:

I have obliterated my own API key from the above picture for security reasons. The links to Web Map Builder on the email you receive are broken so go to the page I mentioned earlier: OS OpenSpace Web Map Builder .

Three points that you may want to make note of here. (1) Your new API key may take half an hour to go through the OS system. So your webpage may say “API Code not valid” for a while, and then not show your map. So go and have a cup of tea and try again later. (2) If you get your API key for http://ourlife.co.uk/, i.e. without an SSL certificate, then it won’t work for https://ourlife.co.uk/. You have to go back and register https://ourlife.co.uk/. Otherwise you get a “HTTP Referrer not Valid” error. (3) If you register https://ourlife.co.uk instead of https://ourlife.co.uk/, i.e. if you register your URL without the end slash, then it won’t work with https://ourlife.co.uk/walking/buxton-to-edale/, for example. It would only work with https://ourlife.co.uk and nothing else.

OK, so now you CAN generate an HTML code that will work, but not with WordPress. WordPress will alter the HTML code, so that it won’t work. You need a couple more steps. What you need to do is to preserve the format of the HTML code in its “raw” form. You need a plugin to do this.

In your WordPress Dashboard go to Plugins, Add New and select RAW HTML:

Install and activate the plugin.

Next, on the webpage that you want the map on you must only view it in your dashboard under “Text” and not “Visual” as WP will corrupt the raw html code. So, in the left hand column of your Dashboard,  go to Users and select “Your Profile” and select “disable the visual editor when writing”:

Then go to the bottom and select “update profile”.

Now you CAN paste the map HTML code into your website BUT it must be between  [ raw ]…[ /raw ] or <!–raw–>…<!–/raw–> tags. Whilst on the subject of tags, you need to preceed the map with the < !–more– > tag otherwise if folks search your website by category then the map doesn’t show on category view, still works when they land on the post itself though.

One of the best things that you can do, once you get this far, is to highlight and copy ALL of the code in your post, and save it as a *.txt or *.html file, and also copy any picture files you have and save them in a folder on your own computer. That way, if you mess up, then you have a backup copy of your post.

So if you head on over to http://ourlife.co.uk/walking/buxton-to-edale/  for example, then you can see a working, interactive, OS map.

I will check out what the raw tags do. Maybe they actually stop WP from corrupting the code, even in the Visual Editor.

The generated maps do have a link to “Terms of Use” but unfortunately that is broken and I guess Ordnance Survey will fix it. One of the terms is that End Users, that is the folk who view your website (you are the Developer), are not allowed to print off more than ten copies of your map. I encourage end users to buy their own Explorer maps anyway.

The rest of the email that I received from Ordnance Survey gives information about other products, including premium products, that are available under licence:-

“Licences:

If you wish to licence data at 1:50 000/1:25 000 scale in TIFF format, then you can take out a Direct customer licence. This licence allows you to use the data for your internal business use (non-commercial) including display and promotion, provided you maintain a valid licence while you do this. This licence also offers annual updates for any new revised data. Licence fees start at £100.00 per product.

Should you wish to display mapping on the internet for the purpose of demonstrating the location of or providing directions to your premises, static assets owned by you, your area of operation and/or a bespoke event organised by you, then you can do so under the terms of our Paper Map Copying Licence. Minimum fee £54.75 +VAT

The Publishing Licence may be suitable if you are publishing mapping on the internet copied from either paper maps or taken from data and you are a small website publisher publishing raster images of mapping which cannot be edited, manipulated, interrogated, geo-referenced or customised in any way or used within geographical information system or other comparable database or software system. You may make Financial Gain through advertising and sponsorship on the website. Licence fees are payable on an annual basis. Minimum fee £47.50 + VAT

If you intend using 1:50 000 Scale Raster Mapping on a website scanned from paper maps you can do this without charge and use up to 100 map extracts (size restrictions apply). Please complete the Publishing request form above and tick the appropriate box.

These licences can be viewed on our website here: https://www.ordnancesurvey.co.uk/business-and-government/licensing/direct-customers/internet-use.html ”

 

 

Contact details of Ordnance Survey:-

Customer Services, Ordnance Survey
Adanac Drive, Southampton, United Kingdom, SO16 0AS Phone +44 (0)3456 050505 | Fax +44 (0)3450 990494
Textphone (deaf and hard of hearing users only please) +44(0)23 8005 6146
www.os.uk.
Email: customerservices@os.uk and opendata@os.uk