Can someone comment on Best Practices to make an unusual shape a trigger for MouseOver and Selections?
The attached image shows two regions that need to be selectable, both in triggering a MouseOver and then link to a different Scene.
Can I create the shape as an SVG give it no fill color or stroke, yet still used for creating a selection? Is it as simple as assigning an ID to the SVG when it is created and then setting it’s Opacity as zero? Will it still be present for selection/interaction?
The reason for this requirement is that rectangular slices overlap creating inaccurate selection areas. There isn’t an image mapping option is there?
Update: Seems that setting an Object (SVG) to an Opacity of zero will still allow it to be present on the Stage where you can assign Events such as OnClick etc…
Attached image is shown as partial opacity but works just as well when set to Zero.
Unfortunately it is still present as a Rectangle bounding box…
I’ve created an Element, then used InnerHTML to set the values of an SVG that contains an id of Asset-1
Next, there is a function that recognize the SVG:
function onLoadListeners(hypeDocument, element event) {
var area1 = document.getElementById('Asset-1')
area1.addEventListener("onclick", function () {
alert ('Hello World!');
If it allows me to achieve my goals, I’m in!