Using event bubbling effect to pass click event to underneath object in perspective Ignition Early Access Hello, Right now the perspective doesn’t support SVG click event to passes the name of the selected element. I try to have this simply by adding some transparent label underneath each element and assign of event click script for my requirement. I put the label underneath SVG because I want to use the CSS hover effect for each element. As of 8.1, we have some options called stop propagation. If I uncheck this option, the click event of SVG should pass to the underneath object but it doesn’t w…

With a responsive design, it is not possible to use the coordinates of those elements as they will be changed by screen sizes. Is there any way that I can click on each element and know which element I clicked on?

Maybe you’re talking about functionality that wasn’t in perspective when I last did custom SVG stuff in Perspective. I put an SVG in Image management and loaded it into an image control.

From there you can use the “Tint/Color” property to color it. That might not be the functionality you’re looking for because it will color the entire SVG but I thought I’d mention it in case it is helpful.

There is currently no way to respond to click events at the element level. You could potentially, with a whole lot of work, use the click event of the entire SVG, but that is far from trivial.

If you need to respond at this level, then you should split the SVG up into smaller components. Which depending on the number of components could become a performance issue.

One potential solution would be to have the SVG in a coordinate container set to percent mode. Then place an Icon (or other lightweight component) with an empty path effectively making it transparent on top of the areas where you need to respond to a click event. Make sure you set the coordinate container to maintain the Aspect Ratio.

Then you can respond to click events on the icon and modify the elements as needed.

It is perspective right? You kinda need acces to javascript for this to make work…

I ended up making a perspective module for nader which can read out the names (ids) of the svg elements.
Allowing you to use it to trigger events.

If you are interested in some more info about the module and price, feel free to send me a private message.

Gonna try to keep this topic updated with all my cool injectings Version 8.1.22 svg clicker https://forum.inductiveautomation.com/t/new-feature-perspective-piping/49919/138?u=victordcq