You are not logged in.

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

1

Friday, April 5th 2019, 7:05pm

Text layer should be over hotspot.

Hello -

I'm dynamically adding hotspots with a text layer to my flatpano map. Works great. However, if a hotspot falls ontop of a poly shaped hotspot, I run into issues with onclick js code (i.e. when i click the hotspot, both the hotspot and poly functions are called). So, after reading the support forum, I changed the hotspot to render as "css3d". This fixed the issue with the hotspot that is plotted over a poly hotspot. However, now I'm running into an 'order' issue between the hotspot and the text layer. The text layer is a number that is centered over its parent hotspot. When I change the hotspot to render as css3d, the hotspot image is 'over' the text layer. I need to have the text later over the hotspot. I hope that makes sense. Thank you.

krpano.call("addhotspot(" + hs_name + ")");
krpano.set("hotspot["+hs_name+"].url", "include/hotspot.png");
krpano.set("hotspot["+hs_name+"].renderer", "css3d"); //testing w/ poly
krpano.set("hotspot["+hs_name+"].distorted", true);
krpano.set("hotspot["+l_pt+"].zorder", "1");
krpano.set("hotspot["+hs_name+"].ath", h);
krpano.set("hotspot["+hs_name+"].atv", v);
krpano.set("hotspot["+hs_name+"].ox", "0");
krpano.set("hotspot["+hs_name+"].oy", "0");
krpano.set("hotspot["+hs_name+"].alpha", "0.75");
krpano.set("hotspot["+hs_name+"].scale", "0.006");
krpano.set("hotspot["+hs_name+"].edge", edge);
krpano.set("hotspot["+hs_name+"].capture", false);

var l_pt = "layer_" + d[o].hotspots.hotspot_id;
krpano.call("addhotspot(" + l_pt + ")");
krpano.set("hotspot["+l_pt+"].type", "text");
krpano.set("hotspot["+l_pt+"].parent", hs_name);
//krpano.set("hotspot["+l_pt+"].zorder", "2");
krpano.set("hotspot["+l_pt+"].align", "center");
krpano.set("hotspot["+l_pt+"].html", d[o].hotspots[i].hotspot_id);
krpano.set("hotspot["+l_pt+"].alpha", "1");
krpano.set("hotspot["+l_pt+"].scale", "0.006");
krpano.set("hotspot["+l_pt+"].distorted", true);
krpano.set("hotspot["+l_pt+"].ath", h);
krpano.set("hotspot["+l_pt+"].atv", v);
krpano.set("hotspot["+l_pt+"].ox", "0");
krpano.set("hotspot["+l_pt+"].oy", "0");
krpano.set("hotspot["+l_pt+"].edge", "center");
krpano.set("hotspot["+l_pt+"].bgcolor", "0xffffff");
krpano.set("hotspot["+l_pt+"].bgalpha", "0");
krpano.set("hotspot["+l_pt+"].css", "font-family:Arial; font-size:16px; color:#000000;");
[/i]
dmc123 has attached the following images:
  • good.jpg
  • bad.jpg