Irregular hotspot onover/onout behaviour when addding child elements (1.19 webgl behaviour)

I'm dynamically creating a plugin element and adding it as child element to a hotspot when i receive the hotspots onover event.
This is so I can display a text box as a 'hotspot popup'.

This was working fine in the 1.18 releases, and works in 1.19pr8 cssd3 mode,
however since 1.19 the webgl behaviour is behaving strangely after i add the plugin child element.

This is the correct behaviour (working in 1.18.4 and 1.19pr8 (css3d)).

(use the keys a/z to zoom in/out)
demo video:
https://test.fancam.com/hotspot_hover/…_compressed.m4v
live link:
https://test.fancam.com/hotspot_hover/?v=1184

And the buggy behaviour (1.19pr8 webgl)
demo video:
https://test.fancam.com/hotspot_hover/…_compressed.m4v
live link:
https://test.fancam.com/hotspot_hover/?v=119pr8

the essence of the xml:

<action name="onStartup">


		addhotspot(hs);
        set(hotspot[hs].scale, 0.5);
        set(hotspot[hs].zoom, false);
        set(hotspot[hs].height, 'prop');
        set(hotspot[hs].zorder, 10);
        set(hotspot[hs].alpha, 0);
        set(hotspot[hs].enabled, true); 
        tween(hotspot[hs].alpha, 1, 1);
        set(hotspot[hs].ath, -63.26);
        set(hotspot[hs].atv, -5.12);
        set(hotspot[hs].url, 'tag.png');
        set(hotspot[hs].onout, onTagOut(hs, 'hs'));
        set(hotspot[hs].onover, onTagOver(hs, 'hs'));


</action>


<action name="onTagOut">
        trace('onTagOut: ',  %1);


        txtadd(tag_hover, 'th_', %1);
        removeplugin(get(tag_hover));
        trace('removing hover: ', get(tag_hover));
        set(hotspot[%1].zorder,10);
</action>




<action name="onTagOver">
        trace('onTagOver: ', %1);


        txtadd(tag_hover, 'th_', %1);
        trace('creating hover: ', get(tag_hover));
        addplugin(get(tag_hover));
        set(plugin[get(tag_hover)].url,"%HTMLPATH%/assets/swf/plugins/textfield.swf");
        set(plugin[get(tag_hover)].css,"text-align:left; vertical-align:top; color:#000000; font-family:Arial; font-size:18px;background-color:#ffffff;border-radius: 5px;padding-top:10px;padding-bottom:40px;padding-left:76px;padding-right:10px;min-width:204px;");
        set(plugin[get(tag_hover)].html,"someone");
        set(plugin[get(tag_hover)].align,top);
        set(plugin[get(tag_hover)].x,0);
        set(plugin[get(tag_hover)].y,35);
        set(plugin[get(tag_hover)].enabled,true);
        set(plugin[get(tag_hover)].alpha,1);
        set(plugin[get(tag_hover)].scale,1);
        set(plugin[get(tag_hover)].autosize,left);
        set(plugin[get(tag_hover)].autowidth,true);
        set(plugin[get(tag_hover)].wordwrap,false);
        set(plugin[get(tag_hover)].height,50);
        set(plugin[get(tag_hover)].background, false);
        set(plugin[get(tag_hover)].visible,true);
        set(plugin[get(tag_hover)].border,false);
        set(plugin[get(tag_hover)].parent, hotspot[%1]);
        set(plugin[get(tag_hover)].html, %2);    
        set(hotspot[%1].zorder, 11); 


</action>

It seems there are 2 problems here.

1. after the child element has been added and removed again the hittest area for the hotspot seems to stay at the zoom level when the child was added. i.e. onover is being triggered way outside the bounds of the hotspot when we are zoomed in.

2. onout is being triggered on the bounds of the original hotspot itself and is ignoring its newly added child element.

any ideas what might be causing this? or for a workaround?

Thanks a lot for your suggestions..!

1. tried changing the hotspot name to newhs, but i didn't see a change in behaviour in any way.

2. Thanks, i removed this and it seemed unnecessary as you suggested.

3. Again, i removed this and it was necessary.

4. The z-order is just so the popup will show on top of any other surrounding tags (if they happen to be near)..
In the real use cases there are literally thousands of tags shown all over the picture.

Despite your suggestions, I'm still getting the same symptoms though.. :(

For now the only option i have is to disable webgl for all browsers, but i'm afraid that the css3d support isn't equal supported across all browsers.

Thanks, thats a nice little solution, though the final solution has more info than just text, there are a number of clickable images as well..
Can i hang a more complicated plugin hierarchy from this hover box?

Also for mobile support I am using onclick to rather toggle the popup and not use onover/onout.. any ideas how this solution could work on mobile?

Hi, I've managed to successfully workaround the problem by simply adding the renderer="css3d" to the hotspot.
This way the bug in the webgl renderer is bypassed..


So far the workaround seems to work very well with no performance hit.