Hi all,
My clickmap has several screw heads, each being a group consisting of a circle, a path in the shape of a cross for a phillips screwdriver to go into, and an elipse that acts as a highlight. Each screw head group has an onclick event, and it fires just fine. But...
In the Javascript function that receives the onclick event, evt.target is not the group, it's the individual geometry within the group that got clicked. So depending on the exact position of the mouse when clicking, it could be the circular head, the path of the cross, or the elipse highlight. Why an onclick for the group returns a target that's one of the group's items is beyond me. Here's how I dealt with it in the HTML page:
function screwclick(e){ var parnt = e.target.parentElement; var circle = parnt.getElementsByTagName("circle")[0]; circle.style.fill = "gold"; }
I found the parent of evt.target, then found the circle that was part of that parent, and then colored the circle. Before I figured out how to do that, sometimes the cross was turning gold, and sometimes the highlight was turning gold. Now only the circle turns gold.
This could really fool a person who isn't looking for it.
SteveT
Steve Litt April 2017 featured book: Troubleshooting Techniques of the Successful Technologist http://www.troubleshooters.com/techniques