Hotspot Actions not working

[mehscollider]

Hello,

I made a viewer with 3 hotspots. Each hotspot has a Javascript action which calls a function (I put the same name on the hotspot configuration) but the function is not getting called.

I defined the functions on a script tag below the Webrotate code:

<script language="javascript" type="text/javascript">
  jQuery(document).ready(function(){
      jQuery('#wr360PlayerId').rotator({
          licenseFileURL: 'license.lic',
          configFileURL: "https://nuu-group.sfo2.cdn.digitaloceanspaces.com/clients/augmenta/Model/360_assets/Main/Main.xml",
          graphicsPath: "https://nuu-group.sfo2.cdn.digitaloceanspaces.com/clients/augmenta/Model/imagerotator/html/img/basic/",
          zIndexLayersOn: false,
          responsiveBaseWidth: 600,
          responsiveMinHeight: 400,
          googleEventTracking: false,
      });
  });
</script>

<script>
  function ventralFunc(ventral) {
    $('initial-state, .honeycomb, .hydro').hide();
    $('ventral').show();
  }
  
  function honeyFunc() {
    $('initial-state, .ventral, .hydro').hide();
    $('honeycomb').show();
  }
  
  function hydroFunc() {
    $('initial-state, .ventral, .honeycomb').hide();
    $('hydro').show();
  }
</script>

Could you guide me about this issue? This is kind of urgent because I want to show your product on a new website.

 

[WebSupport]

Hi, hmm... can you please share a link to your 360 product view? You can send it to support at webrotate360 dot com.

 

[mehscollider]

Hi, hmm... can you please share a link to your 360 product view? You can send it to support at webrotate360 dot com.

Of course. It is here: https://augmenta-self-285eeceee4da992ea6b0adaa0.webflow.io/

 

[mehscollider]

Also, I can't seem to make the click event work with pure jQuery. What should I do to make this work?

 

[WebSupport]

There're a couple of things here:

When hotspot content is assigned (text content in your case), the click (javascript) action will only trigger when you click on the popup itself. This is designed this way as otherwise your current approach won't work on a touch-screen device. So for the correctly assigned action for honeyFunc, it always triggers fine for me when I click on the popup text.

You can potentially make the text content larger, not fully transparent and have it positioned over the indicator so user has to click it to trigger the action. Or you may design your custom hotspot indicator image (blue circle in your current setup) to include text so the text is always visible.

You can also override this logic using our APIs where you can subscribe to hotspot actions and activation events. You can play with it by publishing your project using API template on the Publish form in SpotEditor. We can provide more details if needed.

 

[mehscollider]

I made one of the hotspots popup bigger but it still does not work. You can see the updated changes at the url: https://augmenta-self-285eeceee4da992ea6b0adaa0.webflow.io/

 

[mehscollider]

I think I solved it. It was a styling issue with the z-index. It works now. Thank you very much.

 

[WebSupport]

thanks for the update!