This is a continuation (part 2) of this previously asked GIS question.
I have an array of objects
. Each object has a name, some score and some Well Known Text.
For each object, I'm displaying the WTK
over an OpenLayers map.
I'm trying to have a tooltip over each shape, but only when the mouse hovers over that shape/feature.
if I have this code here..
var data = [
{ 'aaaa', 100, <some WKT>' },
{ 'bbbb', 32, <some WKT>' },
{ 'cccc', 93, <some WKT>' },
{ 'dddd', 46, <some WKT>' } ]
and for each object in that array I need to generate the feature.. which is more or less like this..
var feature = format.read(data.WellKnownText);
shapeLayer.addFeatures(feature);
var highlightControl = new OpenLayers.Control.SelectFeature(shapeLayer, {
hover: true,
highlightOnly: true,
renderIntent: "temporary"
});
map.addControl(highlightControl);
highlightControl.activate();
I'm guessing I need to define something after the renderIntent
? Like onhover call this function?
Don't forget, I also need to pass to that function data.Name
and data.Score
…
Any suggestions, folks?
Best Answer
you can listen for featurehighlighted and featureunhighlighted events of SelectFeature control, and accordingly create or remove popup.
At first, when creating features - set attributes for them (code sample is also posted by Aragon):
Then, listen for select control's events. On feature highlight, create popup. Code should explain, how you can access attributes of selected feature.
On feature highlight, remove popup from map. Sorry, I'm not sure, is it also necessary to destroy popup:
You can find working example from http://jsfiddle.net/jSQrj/21/
As second alternative, you should be able to display tooltip for feature by defining 'title' in style. I've seen some working examples, but I haven't been able to get it to work myself. Look for 'title' in http://dev.openlayers.org/docs/files/OpenLayers/Feature/Vector-js.html and for 'Attribute Replacement Syntax' in http://docs.openlayers.org/library/feature_styling.html