Tutorial: Web-Darstellung für 360°-Panoramen

Verwendete Version: Pano2VR 5.2.4

Download Testversion: Pano2VR 5.2.5 (64 Bit)

Die folgende Anleitung erklärt die Erstellung von virtuellen Kugel-Panoramen für das Internet, welche bevorzugt unter HTML5 funktionieren. Dabei handelt es sich um eine ausführliche Anleitung, die sich zum Teil auf einen eigenen Pano2VR-Skin bezieht. Die Punkte, welche für den Verwender normaler Pano2VR-Skins uninteressant sind, sind an den entsprechenden Stellen grau markiert und können beim Lesen einfach übersprungen werden. Für Benutzer, die ähnliche Funktionen in ihrem Skin eingebunden haben, können diese Schritte aber eventuell interessant sein. Des weiteren sind natürlich fast alle Parameter variabel und können nach Bedarf verändert werden.

In den Bildern sind die Stellen rot umrahmt, an denen Änderungen vorgenommen werden. Der Rest kann unverändert bleiben.

Ausgangsmaterial:

Dateiformat: JPG

Auflösung: 14.024 x 7.012 Pixel (2:1)

Vorherige Bearbeitung in:

Lightroom (RAW-Entwicklung) > PTGui (Stitching) > SNS-HDR 2 (HDR) + Photoshop (Retusche)

Los gehts…

  • Erstelle einen neuen Ordner > Füge das 2:1 Panorama (JPG) und ggf. eine Sounddatei (MP3) hinzu
    Achtung: Um ein fehlerfreies Ergebnis zu erhalten, sollte zu Beginn, die Bezeichnung des zu bearbeitenden 2:1 Panoramas keine Sonderzeichen und Umlaute enthalten, da dies später bei der internen Adressierung Probleme macht und höhere Auflösungen nicht nachgeladen werden.
  • Öffne Pano2VR und ziehe das Panorama in das Programm
  • gewünschte Startansicht einstellen (Panorama ziehen)
  • „Anzeige Einstellungen“ > Standardansicht: „Setzen“ drücken
  • „Anzeige Einstellungen“ > Blickfeld (Zoom): Min 50° (begrenzt das unendliche hineinzoomen)
  • „Benutzerdaten“ > entsprechend ausfüllen (Panorama-Informationen)
  • „Eigenschaften“ > Hintergrundmusik: Hintergrundmusik-Datei auswählen (wenn gewünscht)
    • Lautstärke: 0,50
    • Wiederholen: 0 (-1 = wird nicht abgespielt, 0 = Dauerschleife, 1 = wird einmal abgespielt, 2 = wird zweimal abgespielt)
    • External: „Externalize file“ aktivieren (erzeugt eine externe Datei im Panorama-Ordner)
  • Ausgabe > „+“ > „HTML5“
  • „Automatische Rotation & Animation“ > „Automatische Rotation“ aktivieren
  • Drehgeschwindigkeit: 0,03°/Einzelbild
  • Verzögerung: 3,0s
  • Skin auswählen und öffnen (Standard-Skin oder eigene Skin)
  • Location des Panoramas ermitteln
    • Google Maps öffnen
    • Aufnahmeort suchen und genau dort einmal klicken wo das Panorama entstanden ist > eine rote Marke erscheint
    • URL markieren & kopieren
  • Skin editieren
  • Skin in Pano2VR entsprechend bearbeiten
    • zuvor kopierten Link zum Ort des Panoramas korrigieren
      • Link unter Parameter unten rechts einfügen (in meinem Fall 2x: Info-Fenster und Button-Leiste)
    • „Schließen“ > „Speichern“
  • Ausgabe erstellen > virtuelles Panorama wird erstellt
  • nachdem die erforderlichen Dateien und Ordner erzeugt wurden (Speicherort ist identisch mit dem Ort des JPG-Panoramas), öffnet sich das virtuelle Panorama automatisch im Browser
  • Browser und Pano2VR schließen > Projekt-Datei speichern (für eventuelle spätere Korrekturen)

Panorama auf eigene Webseite hochladen

  • Server-Programm öffnen (in meinem Fall „FileZilla“)
  • Server, Benutzername und Passwort eingeben > mit dem Server „Verbinden“
  • entsprechenden Ordner für Panoramen öffnen (ggf. vorher einen Ordner dafür erstellen)
  • in diesen Panorama-Ordner ein neues Verzeichnis erstellen, z.B. „alter_bahnhof_os“
  • alle zuvor mit Pano2VR erstellten Dateien (Ordner „Output“) in das neue Verzeichnis auf dem Server ziehen
  • das fertige virtuelle Kugelpanorama kann nun im Internet aufgerufen werden
  • der Link kann nun entsprechend auf deiner Webseite oder an anderer Stelle eingebunden werden und führt nun direkt zu deinem virtuellen Kugelpanorama

Das Ergebnis kann hier begutachtet werden.

FERTIG

 

Das Schreiben dieses Tutorials hat mich viel Zeit gekostet.
Wenn es dir hilft, würde ich mich über eine kleine Spende für die Kaffeekasse freuen.

Vielen Dank