qluqua
Qluqua's fork: what changed
- No right lick credits popup. Right click behave same as left click
- loadingProgress - scene (HTMLElement that you passing to panellum.viewer) has new custom event
loadingProgress. Now you can have information about downloading progress like this:`/** - @param {HTMLElement} - scene that you passed to pannellum.viewer
- @param {String} unit - 'MB', 'KB' etc., it depends on file size
- @param {String} loaded - downloaded data size
- @param {String} fileSize - total size of panorama image
*/
scene.addEventListener('loadingProgress', (event) => {
console.log(event.unit, event.loaded, event.fileSize)
})
` - compassRotation - scene (HTMLElement that you passing to panellum.viewer) has new custom event
compassRotation. Works if you passcompassHidden: trueto viewer config`/** - @param {HTMLElement} - scene that you passed to pannellum.viewer
- @param {Number} rotation - just apply this number to transform rotate of your custom compass
*/
scene.addEventListener('compassRotation', (event) => {
console.log(event.rotation)
})
`
Pannellum
About
Pannellum is a lightweight, free, and open source panorama viewer for the web. Built using HTML5, CSS3, JavaScript, and WebGL, it is plug-in free. It can be deployed easily as a single file, just 15kB gzipped, and then embedded into pages as an <iframe>. A configuration utility is included to generate the required code for embedding.
How to use
- Upload
build/pannellum.htmand a full equirectangular panorama to a web server.- Due to browser security restrictions, a web server must be used locally as well. With Python 2, one can use
python -m SimpleHTTPServer, and with Python 3, one can usepython -m http.server, but any other web server will work as well.
- Due to browser security restrictions, a web server must be used locally as well. With Python 2, one can use
- Use the included multi-resolution generator (
utils/multires/generate.py) or configuration tool (utils/config/configuration.htm). - Insert the generated
<iframe>code into a page.
Using generate.py to create multires panoramas
To be able to create multiresolution panoramas, you need to have the nona program installed, which is available as part of Hugin, as well as Python with the Pillow package. Then, run
python generate.py pano_image.jpgin the utils/multires directory. This will generate all the image tiles and the config.json file in the ./output folder by default. For this to work, nona needs to be on the system path; otherwise, the location of nona can be specified using the -n flag, e.g. python generate.py -n /path/to/nona pano_image.jpg.
Examples
Examples using both the minified version and the version in the src directory are included in the examples directory.
Browser Compatibility
Since Pannellum is built with recent web standards, it requires a modern browser to function.
Full support (with appropriate graphics drivers):
- Firefox 10+
- Chrome 15+
- Safari 8+
- Internet Explorer 11+
- Edge
Almost full support (no full screen):
- Firefox 4+
- Chrome 9+
Partial support (WebGL support must first be enabled in preferences)
- Safari 5.1+
No support:
Internet Explorer 10 and previous
Not officially supported:
Mobile / app frameworks are not officially supported. They may work, but they're not tested and are not the targeted platform.
Translations
All user-facing strings can be changed using the strings configuration parameter. There exists a third-party respository of user-contributed translations that can be used with this configuration option.
Building
The utils folder contains the required build tools, with the exception of Python 3.2+ and Java installations. To build a minified version of Pannellum, run either build.sh or build.bat depending on your platform.
License
Pannellum is distributed under the MIT License. For more information, read the file COPYING or peruse the license online.
In the past, parts of Pannellum were based on three.js r40, which is licensed under the MIT License.
The panoramic image provided with the examples is licensed under the Creative Commons Attribution-ShareAlike 3.0 Unported License.
Credits
- Matthew Petroff, Original Author
- three.js r40, Former Underlying Framework