Here are some examples of how you can configure the 360 HD Viewer on your site. In the examples, you can click on the HTML, CSS or JS tab to see our reference implementation.
360 Viewer - Carousel
360 Viewer - Stacked
360 HD Viewer with alternate content.
Alternate content - Update
360 HD viewer where alternate content is updated at runtime.
360 HD Viewer with custom background.
360 HD Viewer with background color.
360 HD Viewer with multiple features that can be selected by user in a configuration panel.
360 HD Viewer with fallback image.
Get current image url
360 HD Viewer where the function to get the current image is used.
Remove environment shadow
Example of 360 Viewer without environment shadows.
360 HD Viewer with start frame set to frame 10.
360 HD Viewer with a thumbs bar.
Thumbs bar angels
360 HD Viewer with thumb angles set to 0, 90 and -90 degrees.
Thumbs bar location
360 HD Viewer with thumbsbar location set to left.
Thumbs bar - Reorder content
360 HD Viewer where the alternate content is managed to be displayed in different positions.
Example of 360 Viewer with event listeners.
Example of 360 Viewer with webnative AR.
Without Cylindo content
Example of 360 Viewer without Cylindo content, but with custom images.
Without full screen button
Example of 360 Viewer without full screen button.
Zoom - 2K / 4K
360 HD Viewer with custom max zoom value.
Zoom - 2K / 4K Mixed
360 HD Viewer with mixed zoom.
Zoom - Alternate content
360 HD Viewer with a viewer with zoom enabled for alternate content.
Zoom - Custom container
360 HD Viewer where the zoom container is on the right side.
360 HD Viewer where custom zoom container overlaps the Viewer.
Zoom - Default mode
360 HD Viewer with zoom mode property set.
Zoom - Programmatic
360 HD Viewer where programmatic zoom is used.