Javascript function not getting called

CSS styling, controls, custom look and feel, custom packaging and deployment.
Posts: 2
Joined: Fri Sep 21, 2018 2:48 am

Javascript function not getting called

Postby dreidesign » Wed Nov 28, 2018 2:06 am


I'm trying to integrate an intro/help image for a turnaround.

This is my intro image in the xml:

Code: Select all

    <hotspot id="intro" renderMode="2" indicatorImage="" margin="0,0,0,0" align="center,center">
      <spotinfo src="images/spots/start_icon.png" imgWidth="534" imgNoScale="false" clickAction="11" clickData="hideIntro()" />

This is my javascript in the index.html:

Code: Select all

<script language="javascript" type="text/javascript">
function initializeAPI(api){
    var hideHotspot = false;

    function hideIntro(){
        hideHotspot = !hideHotspot;
        api.hotspots.hide("intro", hideHotspot);


        licenseFileURL: 'license.lic',
      configFileURL: '360_assets/index/index.xml',
      graphicsPath: 'imagerotator/html/img/round',
        responsiveBaseWidth: 2560,
        responsiveMinHeight: 0,
        googleEventTracking: false,
        apiReadyCallback: function(api, isFullScreen){
            // apiReadyCallback is also called when user enters full-screen which creates a separate viewer object.
            if (!isFullScreen)


I've looked at the browser console, but not getting any errors. I even tried to do a normal href for the image and set it to "javascript:hideIntro();". But then I'm getting "function is not definied".

Any hints?

Posts: 897
Joined: Thu Aug 23, 2012 11:35 am
Location: Pasadena, CA

Re: Javascript function not getting called

Postby WebSupport » Thu Nov 29, 2018 2:19 am


hideIntro(){} is not visible outside of initializeAPI(){}. You would need to move it outside.

PS: we also have api.hotspots.onAction() which you can call to subscribe to the hotspot action events. You can see how it works in the api template here: ...

Return to “Viewer Development and Customizations”