𝐓𝐡𝐢𝐬 𝐧𝐨-𝐜𝐨𝐝𝐞 𝐩𝐥𝐮𝐠𝐢𝐧 𝐚𝐥𝐥𝐨𝐰𝐬 𝐲𝐨𝐮 𝐭𝐨 𝐛𝐫𝐢𝐧𝐠 𝐯𝐢𝐫𝐭𝐮𝐚𝐥 𝐭𝐨𝐮𝐫𝐬 𝐚𝐧𝐝 𝐩𝐚𝐧𝐨𝐫𝐚𝐦𝐢𝐜 𝐩𝐡𝐨𝐭𝐨𝐬 𝐢𝐧𝐭𝐨 𝐲𝐨𝐮𝐫 𝐁𝐮𝐛𝐛𝐥𝐞 𝐚𝐩𝐩. You can easily create interactive virtual tours, maps, and presentations. The plugin also supports 𝐢𝐧𝐟𝐨𝐫𝐦𝐚𝐭𝐢𝐨𝐧 𝐚𝐧𝐝 𝐧𝐚𝐯𝐢𝐠𝐚𝐭𝐢𝐨𝐧 𝐦𝐚𝐫𝐤𝐞𝐫𝐬 (𝐇𝐨𝐭𝐒𝐩𝐨𝐭𝐬), which can provide information about specific areas within a scene or provide navigation to other rooms or areas.
Panoramic images can be provided in either equirectangular or cube map formats. Equirectangular is the simplest to use as only a single image is needed. However, to ensure support among all WebGL-capable devices, the maximum image size should be preferably limited to 4096px wide; 8192px is also acceptable for most devices. Cube maps require six images but support somewhat higher resolution panoramas, as the vast majority of devices support cube faces up to 4096px across. Although larger images are supported, download sizes should be taken into consideration. This format is a cube map-based format, except each cube face is a tiled image pyramid instead of a single image.

Since it is not obvious from the examples, it is prudent to note that the hotSpotDebug parameter exists to aid in the placing of hot spots. It can be enabled while setting up the hot spots, but it should always be disabled in production.

pannellum.js was used in the process of creating the plugin.

𝐅𝐞𝐚𝐭𝐮𝐫𝐞𝐬:
- Equirectangular, cubic panoramas
- Autoload and autorotate the image for seamless experience.
- Configure autorotation speed to control the image rotation.
- WebGL and CSS 3D based renderers
- Interactive controls with zoom and fullscreen options.
- Hot spots / tours
- Compass headings
- API
- Just 21kB gzipped
- Browser Compatibility
- Plugin is built with recent web standards, it requires a modern browser to function.

Full support (with appropriate graphics drivers):
- Firefox 23+
- Chrome 24+
- Safari 8+
- Internet Explorer 11+
- Edge


𝐃𝐞𝐦𝐨:
For details and demos please visit the plugin page at
https://virtual-tour-52895.bubbleapps.io/version-test/virtual-tour

𝐃𝐞𝐦𝐨 𝐚𝐩𝐩 𝐞𝐝𝐢𝐭𝐨𝐫:
https://bubble.io/page?id=virtual-tour-52895&test_plugin=1737661679083x522969597219438600_current&name=virtual-tour&tab=Design&type=page

𝐌𝐚𝐧𝐮𝐚𝐥:
https://virtual-tour-52895.bubbleapps.io/version-test/virtual-tour-manual

𝐏𝐥𝐮𝐠𝐢𝐧 𝐩𝐚𝐠𝐞:
https://mindforapps.com/plugin_details/virtual-tour

𝐒𝐮𝐩𝐩𝐨𝐫𝐭
If you have questions, reach out to us at [email protected]

We appreciate your reviews and suggestions.