Pannellum: onClick event listener for each hotspot

[jinng2016]

Is there a way to attach an onClick listener to each hotspot? And in that onClick we receive back the hotspot object so we can decide on the next action.

A typical hotspot object looks something like this:

{
    "pitch": 12,
    "yaw": -38.537571183909265,
    "type": "info",
    "text": "Hello world",
},

can we add an another property like onClick inside the object such as:

{
    "pitch": 12,
    ....,
    "onClick": myOnClickFunction, // and `myOnClickFunction` would have the hotspot object passed back in so I can access my custom attributes
}

Or there is another already existing method? I could not find one.

[mpetroff]

I literally just added this yesterday, in https://github.com/mpetroff/pannellum/commit/acf157c96b62f92720422398818da13c7650ca0f (although I forgot to commit the documentation update, a mistake I just remedied in https://github.com/mpetroff/pannellum/commit/79738fabfafd5f3d5b2b9956adb0e090728e4569). A click handler can now be added to a hot spots with the clickHandlerFunc parameter, and the contents of the clickHandlerArgs are passed to the handler along with the click event itself.

[jinng2016]

Cool. When is the next release? If it's too soon, I would probably fork a copy of the branch this commit is in.

[mpetroff]

The next release will be when it's ready. If I give a time frame, I'll probably miss it.

[mustasj]

Was just looking for this!
How do i use it? can't seem to get the function to trigger something. Can you post an easy example? Thanks

[harryhychu]

any example ?

[gazhay]

Was just about to open a new issue, I can't get the clickHandler to work either.

in the config.json I have

"clickHandlerFunc" : "internalJump", "clickHandlerArgs" : "room2"

I've also tried unquoted, still nothing.

[mpetroff]

It needs to be a JavaScript function. This means it has to be passed via the API and can't be used in a JSON file.

[gazhay]

is there a brief example?
My Viewer object returned by pannellum.viewer does not seem to expose any scenes or hotspots.

e.g. I cannot : Viewer.scene.sceneId.hotspots[1].clickHandlerFunc = handler;

Or is this a global function that is attached to the panorama? In which case how do we add args to each hotspot?

[gazhay]

Also, the documentation may be wrong, as it states that both clickHandlerFunc and Args are listed under the "JSON Configuration File Options" section.

[ShenLoong99]

I have a drop down list link with scenes. When I click hotspots to change scenes, the drop down list doesn't change. I want to change it and the only way I can think of is setting an event listener in hotspots. Then, I would link the event listener to a javascript function where it changes the drop down list. Is it possible? How to do it?

[gazhay]

Have a look at the (poor) code here - http://racarbry.com/panoramas/ - its
not a dropdown list but an svg graphic which keeps track of the room you
are in. There should be code in there to do what you want with dropdowns.

On Tue, Dec 29, 2020 at 7:01 AM ShenLoong99 [e-mail]
wrote:

I have a drop down list link with scenes. When I click hotspots to change
scenes, the drop down list doesn't change. I want to change it and the only
way I can think of is setting an event listener in hotspots. Then, I would
link the event listener to a javascript function where it changes the drop
down list. Is it possible?

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/mpetroff/pannellum/issues/252#issuecomment-751972637,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AAGUVV4VTIBTAHOFI2OP5ILSXF5GLANCNFSM4CPZN7VA
.

[ShenLoong99]

Have a look at the (poor) code here - http://racarbry.com/panoramas/ - its not a dropdown list but an svg graphic which keeps track of the room you are in. There should be code in there to do what you want with dropdowns.
…
On Tue, Dec 29, 2020 at 7:01 AM ShenLoong99 @.*> wrote: I have a drop down list link with scenes. When I click hotspots to change scenes, the drop down list doesn't change. I want to change it and the only way I can think of is setting an event listener in hotspots. Then, I would link the event listener to a javascript function where it changes the drop down list. Is it possible? — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#252 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAGUVV4VTIBTAHOFI2OP5ILSXF5GLANCNFSM4CPZN7VA .

Thank you for providing me an example. I have already resolve my issue.