I have created a map using Carto. The map has bespoke images as icon markers. I would like to style the map so that, if the icons overlap, they both render in an offset position so that the full icons are visible, perhaps with a line to the actual co-ordinates. Ideally a function for this exists and can handle any overlap dynamically, if not some manual tips on offset styling will help.
An example of the issue I have is here: https://www.mapbox.com/mapbox-gl-js/example/custom-marker-icons/ If you zoom out far enough on the map, the icons will begin to overlap, which is the behavior I wish to prevent.
Clustering is not an option as I have unique images that need to be visible.
Spidering/Spiderfy (http://jawj.github.io/OverlappingMarkerSpiderfier-Leaflet/demo.html) looks close to what I am after, but this only splits the icons on click rather than as standard.
Moving on from the original question above, i have managed to create hard-coded offsets for overlapping features with the below sql:
SELECT cartodb_id, tree, capacity, the_geom_webmercator FROM tablea where tree NOT IN ('Oak','Willow') UNION SELECT cartodb_id, tree, capacity, st_translate(the_geom_webmercator,20000,0) as the_geom_webmercator FROM tablea where tree = 'Oak' UNION SELECT cartodb_id, tree, capacity, st_translate(the_geom_webmercator,10000,10000) as the_geom_webmercator FROM tablea where tree = 'Willow'
This brings in all other elements in tablea and then styles specific elements with an offset on the X,Y bringing them all together as a union select.
Unfortunately this creates a problem. The hard coded offset is fine at certain zoom levels but looks odd in others. Ideally I want a zoom specific sql query. From what I can tell this doesn't exist in Carto, and you can only style the CSS at specific zoom levels?
Mapbox have created a postGIS function that runs the below:
( SELECT * FROM roads WHERE Z(!scale_denominator!) >= 12 ) AS data
Does anyone know of the Carto equivalent to this? Or perhaps advice on an alternative method?