Forum Discussion
Interaction with 360 degree images
After a couple simple tests, Option #2 or 3 makes it fairly simple to do what you want. The 360 images are projected onto the interior of a sphere, where the viewer is at the center. Accessing the 3d scene (by hooking into the SL scene or by creating your own) lets you access and modify the texture (image) applied to the sphere. You can include additional 360 degree images (in whatever way is appropriate for you), create new/clone materials, and direct the texture source to the appropriate image. Then you can reassign the material with that texture to the sphere, switching the image. This way your scene changes instantly and does not have to reset or reposition.
Option #2 is a hassle but maintains all of the functionality SL offers. It would be nice if the 3d object was directly accessible, but I have yet to find an active reference to it.
For a suggestion to experiment, see this post:
Prevent vertical movement in 360º images | Articulate - Community
FYI-
In the example post, you would be most interested in:window.viewer360.scene.children[0].material
and
window.viewer360.scene.children[0].material.map.source.data.currentSrc
Use the browser developer panel (F12).
If you need the functionality SL includes within the 360 images, then what you are doing is probably about the limit. I haven't been able to find any inbuilt reference to the 360 image viewer as of yet. You can set the initial starting point for each 360 image. Maybe you could deliberately cut to focus on the bird briefly when it is uncovered and then back to the whole scene to better control the transitions. Extra 360 images, but otherwise you can't really control positions.
If you feel adventurous, you can "hack" into the published project (simple edit of one file) and gain access the the image viewer (keeping SL functionality), which opens up a lot of control for positioning and possibly switching the image (it been awhile, can't recall). With some work, you could also add extra functionality native to Three.js that could help your task. I posted something on here about that a while back, but I'd have to search for it. You would just publish to web and then make the edit before using/testing your published project.
You can also just build your own 360 image viewer from an example on the Three.js website. That way you have full control of the viewer and its function without having to hack the SL files. You won't have Storyline's inbuilt functionality however, like hotspots and easy design time editing, but you could build in whatever you needed. I have a really old simple unpolished example someplace, I think.
After a couple simple tests, Option #2 or 3 makes it fairly simple to do what you want. The 360 images are projected onto the interior of a sphere, where the viewer is at the center. Accessing the 3d scene (by hooking into the SL scene or by creating your own) lets you access and modify the texture (image) applied to the sphere. You can include additional 360 degree images (in whatever way is appropriate for you), create new/clone materials, and direct the texture source to the appropriate image. Then you can reassign the material with that texture to the sphere, switching the image. This way your scene changes instantly and does not have to reset or reposition.
Option #2 is a hassle but maintains all of the functionality SL offers. It would be nice if the 3d object was directly accessible, but I have yet to find an active reference to it.
For a suggestion to experiment, see this post:
Prevent vertical movement in 360º images | Articulate - Community
FYI-
In the example post, you would be most interested in:
window.viewer360.scene.children[0].material
and
window.viewer360.scene.children[0].material.map.source.data.currentSrc
Use the browser developer panel (F12).