PANNELLUMFEATURESDOWNLOADDOCUMENTATION 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. Pannellum 2.5.6. DOWNLOADS | PANNELLUM Download. One can obviously also choose to download either for self-hosting or development. When using Pannellum locally, a web server must still be used due to browser security restrictions. With Python 2, one can use python -m SimpleHTTPServer, and with Python 3, one can use python -m http.server, but any other web server will work

as well.

OVERVIEW | PANNELLUM Pannellum is built using WebGL and JavaScript, with a sprinkling of HTML5 and CSS3. It can run standalone or can be embedded using either an or a JavaScript API. The standalone method, which is used for embedding, is the easiest and simplest to use, but the JavaScript API is more powerful and provides tighter integration. Internally, the standalone viewer parses URL REFERENCE | PANNELLUM cubeMap. This is an array of URLs for the six cube faces in the order front, right, back, left, up, down. These are relative to basePath if it is set, else they are relative to the location of pannellum.htm. Absolute URLs can also be used. Partial cubemap images may be specified by giving null instead of a URL.

API | PANNELLUM

image ( Image | Array | Object) Input image; format varies based on imageType. For equirectangular, this is an image; for cubemap, this is an array of images for the cube faces in the order ; for multires, this is a configuration object. imageType string The type of the image: equirectangular , cubemap, or multires.

TOUR | PANNELLUM

Tour. Multiple panoramas can be joined together into a virtual tour using Pannellum’s tour feature. A fade animation between scenes can be configured using the sceneFadeDuration parameter. See the hot spots example for more information on placing the hot spots used to navigate between scenes. Pannellum 2.5.6. Mason Circle.

CUSTOM CONTROLS

The Pannellum API can be used to display custom panorama controls.

CUSTOM HOT SPOTS

Custom hot spots. The Pannellum API can be used to customize hot spots. Pannellum 2.5.6. HOT SPOTS | PANNELLUM Hot spots. Additional information can be displayed on the panorama using hot spots. The hotSpotDebug parameter exists to assist with locating where to place hot spots; when enabled, it prints the coordinates of mouse clicks to the browser’s developer console, which makes it much easier to figure out where to place hot spots.

Pannellum 2.5.6.

COMPASS | PANNELLUM

Compass. The north offset, in degrees, can be specified using the northOffset parameter, allowing a compass to be displayed. This parameter will also be read PANNELLUMFEATURESDOWNLOADDOCUMENTATION 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. Pannellum 2.5.6. DOWNLOADS | PANNELLUM Download. One can obviously also choose to download either for self-hosting or development. When using Pannellum locally, a web server must still be used due to browser security restrictions. With Python 2, one can use python -m SimpleHTTPServer, and with Python 3, one can use python -m http.server, but any other web server will work

as well.

OVERVIEW | PANNELLUM Pannellum is built using WebGL and JavaScript, with a sprinkling of HTML5 and CSS3. It can run standalone or can be embedded using either an or a JavaScript API. The standalone method, which is used for embedding, is the easiest and simplest to use, but the JavaScript API is more powerful and provides tighter integration. Internally, the standalone viewer parses URL REFERENCE | PANNELLUM cubeMap. This is an array of URLs for the six cube faces in the order front, right, back, left, up, down. These are relative to basePath if it is set, else they are relative to the location of pannellum.htm. Absolute URLs can also be used. Partial cubemap images may be specified by giving null instead of a URL.

API | PANNELLUM

image ( Image | Array | Object) Input image; format varies based on imageType. For equirectangular, this is an image; for cubemap, this is an array of images for the cube faces in the order ; for multires, this is a configuration object. imageType string The type of the image: equirectangular , cubemap, or multires.

TOUR | PANNELLUM

Tour. Multiple panoramas can be joined together into a virtual tour using Pannellum’s tour feature. A fade animation between scenes can be configured using the sceneFadeDuration parameter. See the hot spots example for more information on placing the hot spots used to navigate between scenes. Pannellum 2.5.6. Mason Circle.

CUSTOM CONTROLS

The Pannellum API can be used to display custom panorama controls.

CUSTOM HOT SPOTS

Custom hot spots. The Pannellum API can be used to customize hot spots. Pannellum 2.5.6. HOT SPOTS | PANNELLUM Hot spots. Additional information can be displayed on the panorama using hot spots. The hotSpotDebug parameter exists to assist with locating where to place hot spots; when enabled, it prints the coordinates of mouse clicks to the browser’s developer console, which makes it much easier to figure out where to place hot spots.

Pannellum 2.5.6.

COMPASS | PANNELLUM

Compass. The north offset, in degrees, can be specified using the northOffset parameter, allowing a compass to be displayed. This parameter will also be read

TOUR | PANNELLUM

Tour. Multiple panoramas can be joined together into a virtual tour using Pannellum’s tour feature. A fade animation between scenes can be configured using the sceneFadeDuration parameter. See the hot spots example for more information on placing the hot spots used to navigate between scenes. Pannellum 2.5.6. Mason Circle.

VIDEO | PANNELLUM

Video. Equirectangular video can be displayed in conjunction with Video.js. For this functionality, Pannellum’s API must be used.

Pannellum 2.5.6.

SIMPLE TUTORIAL

Simple tutorial. Create a panorama (and save it as an equirectangular image). If it is not a full, spherical panorama, it should include Google Photo Sphere XMP metadata. Upload your image to a site that supports CORS, e.g. Imgur. Use the utility below.

A SIMPLE EXAMPLE