Panorama

 
Enabling Panaramic images

To enable panoramic photos, tick Table IV-A24.2 and a selectionbox will appear on the photo admin page at every photo that may be a panorama, i.e. the width is at least 2 times the height.

Types of Panoramic images

The following types of Panoramic images is supported:

  • 360° spherical images
  • Non 360° flat panoramic images
360° spheric images

For this feature the javascript library THREE.js has been embedded into wppa.

Example 1: A computer generated 3D structure rendered into a 360° spherical image. By Alejandro Giraldez Sanchez.

4837

TOWN-07_MOD03_128--v5--020-360º
Image by Alejandro Giraldez Sanchez

Example 2: A sample from the THREE.js open source software example application by Emanuele Feronato.

4830

THREE-sample-05

Non 360° flat panoramic images

Example 3: A sample provided by M. Marell, Muziekhuis Lyana

4832

IMG_1216

Lightbox

Click on a thumbnail to open the panorama in lightbox.

4836
g140b-09a--360º (Jaap Breetvelt)
g140b-09a--360º
Image by Alejandro Giraldez Sanchez
184 Ansichte
4837
TOWN-07_MOD03_128--v5--020-360º (Jaap Breetvelt)
TOWN-07_MOD03_128--v5--020-360º
Image by Alejandro Giraldez Sanchez
182 Ansichte
4831
ale-atory--0012b-1b-20 (Jaap Breetvelt)
ale-atory--0012b-1b-20
Image by Alejandro Giraldez Sanchez
189 Ansichte
4830
THREE-sample-05 (Jaap Breetvelt)
THREE-sample-05
322 Ansichte
4832
IMG_1216 (Jaap Breetvelt)
IMG_1216
330 Ansichte
4834
MOD04_66_01_01--360º (Jaap Breetvelt)
MOD04_66_01_01--360º
Image by Alejandro Giraldez Sanchez
53 Ansichte
4833
layers-04_01--360º (Jaap Breetvelt)
layers-04_01--360º
Image by Alejandro Giraldez Sanchez
45 Ansichte
4835
MOD12_02_01_01--360º (Jaap Breetvelt)
MOD12_02_01_01--360º
Image by Alejandro Giraldez Sanchez
53 Ansichte

Configuration

Table IV-H contains a few configuration settings. You can switch off the control bar and dragging the image. You can also start the display in a panning mode. These settings apply to all panoramic images on the site, however, if you want a single panorama to be displayed different from all the others, you can set these configuraion settings on the fly with inline settings.
Example:

[wppa_set name="wppa_panorama_control" value="none"][/wppa_set]
[wppa_set name="wppa_panorama_manual" value="none"][/wppa_set]
[wppa_set name="wppa_panorama_autorun" value="right"][/wppa_set]
[wppa_set name="wppa_panorama_autorun_speed" value="3"][/wppa_set]
[wppa type="mphoto" photo="4836"][/wppa]
[wppa_set][/wppa_set]

4836

g140b-09a--360º
Image by Alejandro Giraldez Sanchez

Restrictions

The following restrictions apply to the Panoramic images feature:

  • Because this feature uses the HTML tag <canvas> it works only on browsers that support HTML-5. This is a permanent restriction.
  • As you can see by the shape of the curser when viewing a panorama on a desktop or laptop computer, you can drag the image into any direction; on the flat panorama you can also drag the black rectangle on the preview image. There is no way to drag on a mobile device; this would interfere with the default gesture events. It is still under investigation if there is a way around this restriction.
  • This kind of panoramas is implemented for the display of single photo's and lightbox; one can use any of the three 'plain' single photo shortcodes, e.g.:
    [wppa type="photo" photo="{photo_id}"][/wppa]
    [wppa type="mphoto" photo="{photo_id}"][/wppa]
    [wppa type="xphoto" photo="{photo_id}"][/wppa]
    Additionally you can link thumbnails to lightbox for fullscreen displays.