Clickable icons

Hi,

We have some SVG icons in our nodes, but it seems that they’re only clickable when the mouse is over the “lines” of the SVG, meaning that some parts of the icon are not clickable at all… this makes the experience of clicking an icon not very ideal.

Is there anything we can do to avoid this behaviour? Should we wrap it somehow with other component that will have the click event attached to it?

Thanks in advance.

Are you using a Shape to show that icon? If so, set the Shape.background to “transparent”.

Hi Walter,

Yes, I am using go.Shape. I have tried adding the background, but makes no difference. Since I am no SVG expert, I’m wondering if the icon itself is causing any issue, but happens with any icon from icomoon.

For instance, the “copy” icon, I need to click the edges of the sheet to trigger the click event…
Screenshot 2022-03-03 at 13.23.27

I am guessing that the geometry specified might be the issue.

geometry: go.Geometry.parse(icon, true)

If I remove it, I see the shape as a square, fully clickable, with no icon obviously.

How is your Shape defined?