Pannellum 2.5 has now been released. As with Pannellum 2.4, this was a rather incremental release. The most noteworthy change is that equirectangular panoramas will now be automatically split into two textures if too big for a given device, which means images up to 8192 px across, covering all consumer panoramic cameras, now have widespread support. There has also been a significant improvement of the rendering quality on certain mobile devices (the fragment shaders now use
highp precision), and support for partial panoramas has improved. Finally, there are an assortment of more minor improvements and bug fixes. See the changelog for full details. Pannellum also now has a Zenodo DOI (and a specific DOI for each new release).
Great Matthew! Can I contribute with a donation to support development?
Valerio Rome IT
Sure (and thanks!): https://ko-fi.com/mpetroff
Hey Matthew, firstly – Pannellum is amazing! Well done and thank you for making the web a better place :)
Secondly, I can’t get ‘look around’ by moving your device around to work in Mobile Safari. Every other mobile browser works fine. Is there a trick here or a switch we could prompt the users to turn on?
Apple disabled device orientation events by default in iOS 12.2 due to privacy concerns, so they need to be manually enabled in settings. When iOS 13 is released, there will be an API for triggering a permissions prompt; I just added code for using this, but it’s untested. For more details, see: https://github.com/aframevr/aframe/issues/3976
Hi, I can’t get any equirectangular pictures displayed with Pannellum. It says always file cannot be accessed. Even in simple tutorial, when I add the URL of the picture, the same problem.
What did I wrong?
Look at your browser’s developer tools. The console / network tab should tell you additional details. I suspect you have a CORS configuration issue.
Hi Matthew, I tried it in Firefox and MS Edge. Both are not working. What is CORS?
Can I send you the picture URL by PN or mail for testing?
Please show me the respect of doing a basic internet search before asking questions; if you had done so, you wouldn’t need to ask about CORS. As I said before, look at your browser’s developer tools.
Just found Panellum and I’m really impressed. It took a bit to get into something new (now there’s time) but it was pretty straight forward to get my first test image online (own server). And still plenty to tinker with all the features that I haven’t even tested. A big thank you!
Note: for some reason, using Ubuntu16.04/Firefox75, I get the 4096 limit with 7000×3500 images – no automatic splitting for some reason?
Without knowing why, the 4k limit is no longer an issue. Works.
Thank you for your great Pannellum product!
I would also like to use the customer controls from your example for tours.
When I install the customer controls in a variant with a single image, everything works perfectly, but it does not work in the tour (obviously the eventListeners do not work).
Do you have an idea or an approach for me?
There’s no change between how controls are handled between single images and tours, so I don’t see why you would be having an issue. Custom controls (I assume this is what you mean by “customer controls”) also don’t use any event listeners, so I’m not sure why you’re mentioning them. Also, any issues should also be reported on GitHub, not here.
Hi– Thanks for your continued work on this wonderful tool.
How can/should I have a link outside the viewer that changes which scene is showing in the viewer? E.g. the library on the pannellum.org home page: could you add a caption underneath the image saying, “Don’t miss the (link)sixth floor(/link).”?
I’m not a great programmer, so my klunky idea was to load a new HTML file into the viewer’s iframe– but even then I don’t get how you’d reset the firstScene option. I set up firstScene to be assigned to a window.location.search, which works great but requires reloading the whole page. I have an article that scrolls alongside the viewer and describes the contents of the tour– except that it can’t actually direct you to any particular scene, and reloading the whole page makes the reader lose her place.
Hope that makes sense; any leads welcome.
Use the API, not the standalone /
<iframe>viewer. Then, once you create the viewer with
var viewer = pannellum.viewer(...);, you can switch the scene by calling the
I am testing Pannellum, and it’s super cool when working on desktop browsers. However there is some problem (with Pannellum or with me) on the iOS Safari and iOS Chrome. Images are loading with no results (and no errors).
The same situation is on localhost and in my test domain.
Has anyone faced that problem?
Can you check the developer console with Safari on a Mac? For future reference, the page rendering on Chrome on iOS is identical to Safari, since Apple doesn’t allow for other browser engines.
Thanks for the email on doing a back-button type thing. You said:
“To record the view before the scene changes, you should use the
clickHandlerArgs) hot spot property to add an event listener that records the information you need and then calls
loadSceneinstead of settings the
sceneIdhot spot property.”
That makes perfect sense, but I’m very stuck making the
clickHandlerArgswork and can’t find a model/example. When defining the hotspot, after
clickHandlerArgs: should I be specifying a string, or the name of an object? And does it matter what type (info or scene) the hotspot has?
Hope that makes sense. Thanks,
You can specify whatever you like. There are two arguments passed to the
clickevent and the contents of
clickHandlerArgs. For example, if you set
clickHandlerArgsto be a string, the second argument passed to the
clickHandlerFuncwill be that string. The hot spot type does not matter.
Thanks for the great work. Pannellum is just what we needed.
There are a couple ways that this can be done. There’s an undocumented hot spot
imageparameter, which can be used instead of the hot spot
textparameter to supply an image URL; it’s not very flexible and is poorly tested, which is why it’s undocumented and not officially supported. You could also use the
createTooltipArgsto create custom hot spot tool tips (see custom hot spots example) that could contain an image, but that’s quite a bit more complicated than just following directions.