Forum Discussion
360 Images in Rise
Hey everyone! I've been experimenting with embedding 360° panoramic images directly into Rise using the Code Block and Pannellum, a free, open-source WebGL viewer, and honestly it turned out way cool.
The build is a single HTML file you paste into a Rise Code Block. What you get out of the box:
- Auto-panning on load with a play/pause toggle
- Multi-scene navigation (forward/back buttons that loop)
- Fullscreen without any image distortion
- Clean minimal controls that stay out of the way
All you need is a song in your heart, and some hosted equirectangular images. I hosted the images in another Rise lesson for simplicity. I'm attaching the index files for both versions. Give it a go.
Happy to answer questions or nerd out about it in the comments. 🙂
6 Replies
Such a cool example as always destery1kenobi!
Very effective! To support the intended learning experience, please recommend a song for the heart.
Oh this is so neat! I love seeing it "flow" in the course itself (and would love to play a "geoguessr" version of this someday!)
How to use other 360 images; I replaced the image_url with local file name, but the image is not loading.
Where should i upload these images and use as link?
I have them stored in my RIse project. I create either a stand alone project or lesson in
my 360 project called "Image Repo" . This is where I upload the images using any of the image block opt
ions. Typically I use the four column grid so I can upload everything into one block.
Last step is to hover over an image > right click > then choose "Copy Image Address".
That is the image you use when vibe coding the player. Tell your AI tool of choice to use this link for the image in this scene. Let me know how it goes.
Good luck! - Destery
Thanks for the detailed steps. Works as a charm!👌
