1

Based on the OpenLayers Dynamic clusters example to tried to implement tooltips on feature mouseover. This works fine for unclusterd icons, but not for the ones which are too close to each other and so are spiderfied.

enter image description here

I can't figure out how to distinguish by the features as the have the same source and style. Actually I would need to replace the array index 0 of line 262 of the forked example with the index of the actual mouseovered feature:

tooltip.show(event.coordinate,"<p>" + spiderFeatures[0].get("BAUJAHR") + "</br>" + spiderFeatures[0].get("LEISTUNG") + "kW</p>");
Improve this question
9
  • 2
    You could find the nearest original feature using vectorSource.getClosestFeatureToCoordinate(event.coordinate) codesandbox.io/s/clusters-dynamic-forked-egheub
    – Mike
    Jan 30, 2023 at 14:34
  • Thanks, that looks promising. But in order to make it more clear I would need the tooltip to appear over the icons and not over the cluster. That's why I tried to set the parameter spiderfied and use it in pointermove...
    – geraldo
    Jan 30, 2023 at 16:37
  • To reflect the real feature position set to tooltip coordinate to spiderFeature.getGeometry().getCoordinates() instead of the event (pointer) coordinate.
    – Mike
    Jan 30, 2023 at 17:10
  • They seem to have the same coordinates as the cluster feature, see codesandbox.io/s/clusters-dynamic-forked-ywerdk
    – geraldo
    Jan 30, 2023 at 18:02
  • And any strategy how to handle with features with the exactly same coordinates as getClosestFeatureToCoordinate wouldn't work?
    – geraldo
    Jan 30, 2023 at 18:15

1 Answer 1

Reset to default
2

You could find the nearest original feature using vectorSource.getClosestFeatureToCoordinate(event.coordinate).

To reflect the real feature position set to tooltip coordinate to spiderFeature.getGeometry().getCoordinates() instead of the event (pointer) coordinate.

Some of the original features can be outside the radius of the cluster style (style radius was 20 but the cluster distance is 35) so hover does not detect them. Adding a transparent buffer to the style will fix that.

https://codesandbox.io/s/clusters-dynamic-forked-egheub?file=/main.js

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.