OS OpenSpace [logo]

OS OpenSpace Forum » OS OpenSpace » API Development Help

Thread: Markers with Popups

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

Permlink Replies: 14 - Pages: 1 - Last Post: 22-Mar-2012 20:57 by: ALD2355
ALD2355

Posts: 28
Registered: 13/02/09
Markers with Popups
Posted: 17-Mar-2012 14:21
  Click to reply to this thread Reply

Can anybody tell me what I am doing wrong? I am trying to add a tooltip/title to an array of markers. This is easy in Cloudmade where you simply add a title to the icon but is defeating me in OpenSpace/Layers. My current code is: gridProjection2 = new OpenSpace.GridProjection(); wikilonlat = new OpenLayers.LonLat(geoname.lng, geoname.lat); pos = gridProjection.getMapPointFromLonLat(wikilonlat); infoWindowSize = new OpenLayers.Size(300, 300); content1 = '
' + '' + item + ": " + geoname.title + '' + " : " + geoname.summary; wikiMarker = osMap.createMarker(pos, icon, content1, infoWindowSize); //Try to add info box osMap.events.register("click", wikiMarker, function(e) { osMap.openInfoWindow(wikiMarker, pos, content, infoWindowSize); });

tonydunlop

Posts: 158
Registered: 16/05/09
Re: Markers with Popups
Posted: 17-Mar-2012 16:35   in response to: ALD2355
  Click to reply to this thread Reply

This is how I add a tooltip for a single marker in OpenSpace, whether or not it has a popup:

var marker = osMap.createMarker(pos, null, content, popUpSize );
marker.icon.imageDiv.firstChild.title = "Spinster's Rock"; // tool tip

I'm not sure if that's quite what you're after, but it might point you in the right direction.

Tony

ALD2355

Posts: 28
Registered: 13/02/09
Re: Markers with Popups
Posted: 18-Mar-2012 16:22   in response to: tonydunlop
  Click to reply to this thread Reply

Thanks for this. I have tried this on a single marker as well as on the array of markers and no tool tip appears as I pass a cursor over the marker. Is there anything else I need to do?

Example:

var markers = new OpenLayers.Layer.Markers("Markers");
gmarker = osMap.createMarker(gpoint, gicon, content, infoWindowSize);
gmarker.icon.imageDiv.firstChild.title = content; // tool tip

tonydunlop

Posts: 158
Registered: 16/05/09
Re: Markers with Popups
Posted: 18-Mar-2012 17:14   in response to: ALD2355
  Click to reply to this thread Reply

It should work if your content variable is a properly formed string. How is content defined? The content1 variable in your previous post had the closing ' in the wrong place.

ALD2355

Posts: 28
Registered: 13/02/09
Re: Markers with Popups
Posted: 18-Mar-2012 18:17   in response to: tonydunlop
  Click to reply to this thread Reply

Thanks. Sorry I am not sure what you mean. I have tried this code below and also content as "AAA". This is the code on the original marker: gridProjection2 = new OpenSpace.GridProjection(); wikilonlat = new OpenLayers.LonLat(geoname.lng, geoname.lat); pos = gridProjection.getMapPointFromLonLat(wikilonlat); infoWindowSize = new OpenLayers.Size(300, 300); content1 = '
' + '' + item + ": " + geoname.title + '' + " : " + geoname.summary; wikiMarker = osMap.createMarker(pos, icon, content1, infoWindowSize); wikiMarker.icon.imageDiv.firstChild.title = content1; // tool tip

tonydunlop

Posts: 158
Registered: 16/05/09
Re: Markers with Popups
Posted: 19-Mar-2012 10:18   in response to: ALD2355
  Click to reply to this thread Reply

As a proof of concept for my tooltip method I have adapted a version of the wiki code for a single marker with popup and uploaded it here
http://www.devonperspectives.co.uk/Document1.htm

This works for me (on Windows XP sp3) with the latest firefox, chrome, IE8, and Opera 10.60.

However I did notice yesterday evening that it didn't work using firefox 3.6 on my old PowerBook laptop (it even stopped the popup from appearing), though it worked fine in safari on that platform. Which platforms/browsers did you test on?


Sorry for confusing the issue by suggesting your content string was at fault! I had assumed that since you opened the string definition with ', then it should end with '. On closer examination, given that you are including javascript string variables as components of content, I guess what you have written ends up as a valid string, or at least javascript gives you the benefit of the doubt! Presumably there is an html line-break between the leading ' characters which the forum software has swallowed up.

Tony

ALD2355

Posts: 28
Registered: 13/02/09
Re: Markers with Popups
Posted: 19-Mar-2012 21:37   in response to: tonydunlop
  Click to reply to this thread Reply

Thanks for this. The example obviously works but I cannot get it to work on my map. The map is here at www.sysmaps.co.uk/sysmaps_os.html and I want to put tooltips on to the wikipedia markers. This is line 1699. I will try some more test but I think it is down to layers.

gridProjection2 = new OpenSpace.GridProjection();
wikilonlat = new OpenLayers.LonLat(geoname.lng, geoname.lat);
pos = gridProjection.getMapPointFromLonLat(wikilonlat);
infoWindowSize = new OpenLayers.Size(300, 300);
content = 'Info window contents';
wikiMarker = osMap.createMarker(pos, icon, content, infoWindowSize);
tooltip = item + ": " + geoname.title + " : " + geoname.summary;
wikiMarker.icon.imageDiv.firstChild.title = tooltip; // tool tip
markers.addMarker(wikiMarker);


ALD2355

Posts: 28
Registered: 13/02/09
Re: Markers with Popups
Posted: 19-Mar-2012 21:39   in response to: ALD2355
  Click to reply to this thread Reply

This is the alternative in Cloudmade Leaflet or Google v3 where you add a simple title to the marker:

http://www.sysmaps.co.uk/sysmaps_cm2.html
http://www.sysmaps.co.uk/sysmaps_google3.php

tonydunlop

Posts: 158
Registered: 16/05/09
Re: Markers with Popups
Posted: 20-Mar-2012 12:18   in response to: ALD2355
  Click to reply to this thread Reply

> I will try some more test but I think it is
> down to layers.
>

Your mention of layers reminded me that I had a similar problem getting tooltips to show on one of my pages that used a vector layer. The following code fixed it:

// set vector layer below marker layer to make tool tips visible
markers = osMap.getMarkerLayer();
vectorLayer.setZIndex(markers.getZIndex() - 1);

I don't know whether the GridProjection() method uses the built-in OpenSpace vector layer. If so, the above code might work if proceeded by:

vectorLayer = osMap.getVectorLayer();

tonydunlop

Posts: 158
Registered: 16/05/09
Re: Markers with Popups
Posted: 20-Mar-2012 13:09   in response to: ALD2355
  Click to reply to this thread Reply

BTW, you might be interested to know that in OpenSpace you can make a 'hand' pointer appear when you hover over the marker-with-popup (as Google maps does) using this line:

marker.icon.imageDiv.firstChild.style.cursor = "pointer";

This is unlikely to work unless you can get the analogous tooltip code to work, though.

ALD2355

Posts: 28
Registered: 13/02/09
Re: Markers with Popups
Posted: 20-Mar-2012 20:52   in response to: tonydunlop
  Click to reply to this thread Reply

Thanks for the tip. I tried this on the single marker without success. The map is complicated with all the different makers for click, address, gps, loki, franson, centre and wikpipedia,

Should there be a markers layer for each icon or should I add the icons to a general markers layer?

tonydunlop

Posts: 158
Registered: 16/05/09
Re: Markers with Popups
Posted: 21-Mar-2012 08:25   in response to: ALD2355
  Click to reply to this thread Reply

> Should there be a markers layer for each icon or
> should I add the icons to a general markers layer?

The normal approach is to use osMap.createMarker() for each marker. This adds it to the markers layer provided for you in the OpenSpace map object - the 'general markers layer' if you like; this is referred to as the default marker layer in the API spec. However, looking at your map I see that a new marker appears wherever the map is clicked, and the previous one disappears. I would assume a new marker layer is required each time to implement this, with removeLayer() used to remove the previous one.

Regarding this segment of your map code where you have added my last tip:

markers = new OpenLayers.Layer.Markers("Markers");
centrepos = osMap.getCenter();

// set vector layer below marker layer to make tool tips visible
vectorLayer = osMap.getVectorLayer();
markers = osMap.getMarkerLayer();
vectorLayer.setZIndex(markers.getZIndex() - 1);

1. You are omitting to add the new markers layer to the map: this line is missing here and some other places in your code where a markers layer has been created:

osMap.addLayer(markers);

2. My code snippet is fetching the default marker and vector layers. Since you are using OpenLayers to create and add new layers to the map, and adding features or markers to these, the snippet needs changing to reflect this: this line on its own should be sufficient (assuming your vector layer is always called vectorLayer):

vectorLayer.setZIndex(markers.getZIndex() - 1);

Message was edited by: tonydunlop

ALD2355

Posts: 28
Registered: 13/02/09
Re: Markers with Popups
Posted: 21-Mar-2012 16:06   in response to: tonydunlop
  Click to reply to this thread Reply

Thanks for this.I have made some changes on a map called www.sysmaps.co.uk/sysmaps_os3.html but I still cannot get it to work. I will keep trying. The tooltip is fine but something seems to be stopping the display.

ALD2355

Posts: 28
Registered: 13/02/09
Re: Markers with Popups
Posted: 21-Mar-2012 20:47   in response to: ALD2355
  Click to reply to this thread Reply

See www.sysmaps.co.uk/sysmaps_bkg.html. I have implemented the tooltips on this OSM map and will try to repeat this on the OSMap and IGN map as an example.

ALD2355

Posts: 28
Registered: 13/02/09
Re: Markers with Popups
Posted: 22-Mar-2012 20:57   in response to: ALD2355
  Click to reply to this thread Reply

I have now fully implemented the os map with popups. Thanks for your patience and help. See: www.sysmaps.co.uk/sysmaps_os.html.

I have also used the same method on French IGN and OpenStreetMap/German BKG
at: www.sysmaps.co.uk/sysmaps_ign.html and www.sysmaps.co.uk/sysmaps_bkg.html.

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