mpetroff / pannellum

Pannellum is a lightweight, free, and open source panorama viewer for the web.
https://pannellum.org/
MIT License
4.15k stars 710 forks source link

Removing white screen between images loading without using scenes #1211

Open devinmarkley opened 2 months ago

devinmarkley commented 2 months ago

On our platform user go between many images very quickly and the white flashing screen between images is nauseating. Is there a way to have the image currently being viewed remain on screen until the next image is ready to be displayed.

Thanks!

mpetroff commented 2 months ago

the white flashing screen

You're going to have to clarify your configuration. There should not be any such screen for equirectangular images, and for multires images, the default color is black.

Assuming you're using multires images and have just changed the default color, there are two things you can do to alleviate this.

First, there's the sceneFadeDuration configuration parameter, which allows you to specify a fade from the old scene to the new scene; this gives the new scene more time to load, which should lessen the effect.

Second, using the master branch, you can specify either the shtHash or equirectangularThumbnail configuration options. The shtHash parameter allows you to provide a spherical-harmonic-transform-based preview, and the equirectangularThumbnail parameter allows you to provide a Base64-encoded equirectangular thumbnail image. In either case, the preview will be immediately displayed instead of the solid color, prior to any tiles being loaded. The current version of generate.py will generate the shtHash for you, assuming pyshtools is installed.

devinmarkley commented 2 months ago

Sorry for the lack of specificity. I'm serving equirectangular images outside of a tour as I don't know all the images that the user may want to access. When user click to move to the next image the previous image they were viewing disappears and the screen below appears. I'd like the previous image to remain until the new image is ready to be served.

Screenshot 2024-04-17 at 7 22 44 AM
mpetroff commented 2 months ago

Tours can still be and should be used in the context you're describing. When you want to move to a new image, use the API's addScene method to add it as a new scene followed by the loadScene method to switch to it (you can optionally use removeScene to remove the previous scene after switching). This avoids the loading screen background and avoids repeatedly creating new WebGL contexts.