OS OpenSpace [logo]

OS OpenSpace Forum » OS OpenSpace » Web-map builder

Thread: Empty Map Box even after swearing at it

Reply to this Thread Reply to this Thread Search Forum Search Forum Back to Thread List Back to Thread List

Permlink Replies: 5 - Pages: 1 - Last Post: 17-Jul-2011 11:53 by: jonlynch
quintain

Posts: 4
Registered: 30/05/11
Empty Map Box even after swearing at it
Posted: 15-Jun-2011 19:19
  Click to reply to this thread Reply

[nobr]Hi,
I have tried today to build a test map on a test site but am only getting an empty white box with a 1px frame.
The site is a Wordpress static site using WP 3.1.3 on Atahualpa theme but the same results on twentyten theme.
I have disabled all plugins but no good.
I have used Raw HTML plugin (http://w-shadow.com/blog/2007/12/13/raw-html-in-wordpress/) also tried everything without the plugin.
Tried the map in a Post and a Page document.
Deleted WP Visual Editor on some tests but not others.
Checked and double etc etc checked my API to be correct for the site.
I have even carried out my ultimate technical skill of swearing at it !!!
The following code with my initials (rwm) have been and then not been used trying to sort this out.
Can anyone either advise how to fill the empty box or send me some new expletives!!!

My code with API partially hidden is:
(rwm)<!--start_raw-->(rwm)
(rwm)<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>(rwm)
(rwm)<title>Open Space Web-Map builder Code</title>(rwm)
(rwm)<!-- Download OpenSpace API using your key -->(rwm)
<script type="text/javascript" src="http://openspace.ordnancesurvey.co.uk/osmapapi/openspace.js?key=A5>>>>>>>>>>>>1DE0405>>>>>>>>387"></script>
<script type= "text/javascript" src="http://openspace.ordnancesurvey.co.uk/osmapapi/script/mapbuilder/basicmap.js"></script>
<script type= "text/javascript" src="http://openspace.ordnancesurvey.co.uk/osmapapi/script/mapbuilder/searchbox.js"></script>
<script type="text/javascript">
function initmapbuilder()
{
//initiate the map
var options = {resolutions: [2500, 1000, 500, 200, 100, 50, 25, 10, 5, 4, 2.5, 2, 1]};
osMap = new OpenSpace.Map('map', options);

//configure map options (basicmap.js)
setglobaloptions();
//add a postcode/gazetteer search box (see searchbox.js)
addSearchBox(1);
//set the center of the map and the zoom level
osMap.setCenter(new OpenSpace.MapPoint(302515,514915),7);}
</script>
(rwm)</head>(rwm)
<body onload="initmapbuilder()">

(rwm)</body>(rwm)
(rwm)</html><!--end_raw-->(rwm)[/nobr]

quintain

Posts: 4
Registered: 30/05/11
Re: Empty Map Box even after swearing at it
Posted: 15-Jun-2011 22:49   in response to: quintain
  Click to reply to this thread Reply

I forgot to give the site
www.cleatormoor-tc.org.uk

rgphilpott

Posts: 146
Registered: 18/06/12
Re: Empty Map Box even after swearing at it
Posted: 16-Jun-2011 10:25   in response to: quintain
  Click to reply to this thread Reply

Essentially the same problem as the one in this thread:

https://openspace.ordnancesurvey.co.uk/openspaceforum/thread.jspa?threadID=1335&tstart=0

ie, you are trying to embed one <body> tag inside another one - you can't do that!

The solution is basically the same, too - just copy the script blocks and the map div into the raw html plugin, ignoring all the rest (including the body tags),

Then insert a jQuery call into the start of the last script block to invoke the initmapbuilder() function when everything else has loaded:

$(document).ready(initmapbuilder);


Richard.

quintain

Posts: 4
Registered: 30/05/11
Re: Empty Map Box even after swearing at it
Posted: 16-Jun-2011 17:05   in response to: rgphilpott
  Click to reply to this thread Reply

Hi Richard I have tried to do what you suggested but no good as yet. I have placed the jquery call $(document).ready(initmapbuilder); in (I think) all possible positions. My script is as below, would you be good enough to look and advise me on it. BTW I have removed all trial posts except the one named 'cleatormoor1'. Also when you say"place into raw html plugin" I am placing the code in a post and selecting all of the 4 options of the plugin. I am testing in latest FF, IE & Opera <script type="text/javascript" src="http://openspace.ordnancesurvey.co.uk/osmapapi/openspace.js?key=A5BEED18161E8B1DE0405F0AC8602387"></script> <script type= "text/javascript" src="http://openspace.ordnancesurvey.co.uk/osmapapi/script/mapbuilder/basicmap.js"></script> <script type= "text/javascript" src="http://openspace.ordnancesurvey.co.uk/osmapapi/script/mapbuilder/searchbox.js"></script> <script type="text/javascript" $(document).ready(initmapbuilder);> function initmapbuilder() { //initiate the map var options = {resolutions: [2500, 1000, 500, 200, 100, 50, 25, 10, 5, 4, 2.5, 2, 1]}; osMap = new OpenSpace.Map('map', options); //configure map options (basicmap.js) setglobaloptions(); //add a postcode/gazetteer search box (see searchbox.js) addSearchBox(1); //set the center of the map and the zoom level osMap.setCenter(new OpenSpace.MapPoint(414350,297010),1);} </script>
............................. Sorry for how all the lines of my reply are running together, I am not sure what I have done !! Message was edited by: quintain

rgphilpott

Posts: 146
Registered: 18/06/12
Re: Empty Map Box even after swearing at it
Posted: 16-Jun-2011 21:17   in response to: quintain
  Click to reply to this thread Reply

Your jQuery needs to be within the script block, not inside the tag.

Also, in the online version (though not in the code above) you seem to have mangled the definition of the initmapbuilder() function -- the jQuery call should have been in addition to the function definition, not instead of it.

Your final script block should look something like this ...

<script type="text/javascript" >

$(document).ready(initmapbuilder);

function initmapbuilder()
{
var options ={resolutions:[2500,1000,500,200,100,50,25,10,5,4,2.5,2,1]};
osMap = new OpenSpace.Map('map',options);
setglobaloptions();
addSearchBox(1);
Map.setCenter(new OpenSpace.MapPoint(414350,297010),1)
}
</script>

jonlynch

Posts: 5
Registered: 10/12/09
Re: Empty Map Box even after swearing at it
Posted: 17-Jul-2011 11:53   in response to: rgphilpott
  Click to reply to this thread Reply

If you are still having problems replace the $ with jQuery since wordpress runs jQuery in no conflict mode (so the $ is not available).

An alternative that I use is:

window.onload = function() {
//map code goes here
}

rather than naming and calling the function.

Legend
Expert: 51 - 1000 pts
Advanced: 31 - 50 pts
Intermediate: 16 - 30 pts
Novice: 5 - 15 pts
Newbie: 0 - 4 pts
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums