Anzeigen großer Fotos im Internet.
Ich stelle heute eine Möglichkeit vor, wie man große oder sehr große Fotos schnell übertragen und anzeigen kann. Das Ziel ist es, selbst größte Bilder verzögerungsfrei im Internet zu laden und darin in Echtzeit zoomen zu können. Ein sehr großes Bild kann dabei mehrere Gigabyte umfassen. Kein Anwender würde sich Minuten oder gar länger vor den Bildschirm sitzen und warten um endlich etwas zu sehen. Das erste Beispiel besteht aus 4, das zweite aus 38 Fotos zusammengesetzten Fotos. Das “kleine” Bild ist 16.000 Pixel lang, das größere 38.000 Pixel.
Das Ergebnis dieses Mal gleich zu Beginn, die Erklärung zur Herstellung hinterher.
Bedienungshinweise
Mit dem Scrollrad hinein/herauszoomen und den Bildausschnitt mit der Maus verschieben. Es ist auch möglich die am unteren Rand angezeigten Icons zu verwenden. Ich empfehle den Browser auf Vollbild zu schalten. Dazu auf das rechte Icon klicken. Die Windows Funktion mit F11 und bei Macversion mit CTRL+CMD+F, funktioniert aber auch noch.
Hafen Monaco 38.000 x 8500 Pixel
Tannenzapfen von innen
Ergänzung 2022: Meine Pralienenschachtel
Vom Foto bis zur Anzeige
Das erste Bild habe ich aus vier normalen Fotos, die ich jeweils ca. 20% überlappen ließ, erstellt. Für den Zusammenbau großer Fotos verwendete ich Lightroom. Für Fotos im Gigabytebereich, also dem zweiten Beispiel, habe ich Autopano Giga. verwendet da diese Software es mühelos schafft auch hunderte von Fotos und mehr, sauber zusammen zu bauen. Das Ergebnis ist dabei oft verzerrungsfreier und korrekter als bei den Adobe Produkten.
Technik in Kürze
Jetzt wird es etwas komplizierter. Mit einer weiteren Spezialsoftware, nämlich krpano, wird das zusammengebaute große Foto nun wieder in viele kleine und unterschiedliche große Bildschnippsel zerlegt. In Fall des Schiffs waren es ca. 500 Teile, beim Hafenpanorama bereits 1800. Je tiefer die virtuelle von 6 Ebenen (für den Anwender Zoomstufe) , umso mehr Bildteile werden dafür angelegt. In nächsten Schritt erzeugt die Software dann einen html 5 Code. Mit einer XML-Steuerdatei können letztendlich die Funktionen der Anzeige sehr umfangreich eingestellt und auch selbst programmiert werden.
Das Bild wird angezeigt
Beim Aufruf des Bildes wird zuerst ein Übersichtsfoto angezeigt und im Hintergrund die Einzelteile nachgeladen. Zoomt der Anwender in das Bild, werden je nach Zoomstufe und völlig unbemerkt vom Anwender, die Bilder der jeweilig zugeordneten Ebene nachgeladen. Eine geniale Lösung, die das Anzeigen selbst größter Bilder fast verzögerungsfrei ermöglicht. Damit ist das Ziel erreicht das Anzeigen großer Fotos im Internet zu realisieren.
Für mich war das ein großes Bild
Das größere Panorama im Hafen von Monaco habe ich Balkon eines Kreuzfahrtschiffs erstellt. Das Bild besteht aus mehreren Reihen und Spalten von Aufnahmen. Jede besteht wiederum aus 3 Einzelfotos mit unterschiedlichen Belichtungszeiten. Man erkennt auch die Probleme die mit dieser Art Fotos auftreten können. Das Bild deckt einen Bereich von 180 Grad ab. Dadurch kann die Licht und Wettersituation auf beiden Seiten natürlich unterschiedlich sein. Um dem entgegen zu wirken, habe ich pro Foto drei Aufnahmen erstellt (HDR) , um die Lichtverhältnisse etwas ausgleichen zu können. In Summe wurden es 170 Aufnahmen, von denen ich 114 ausgesucht und weiterverarbeitet habe. Die Dateigröße beträgt 2,82 Gigabyte in Photoshop und als fertiges JPG-Foto noch immer 300 MB.
Verwendete Hilfsmittel und Reihenfolge der Bearbeitung.
1. Lightroom (Zusammenbau der einzelnen Aufnahmen zu einem HDR Foto)
2. Autopano Giga (Zusammenbau der HDR Fotos zu einem großem Foto)
3. Photoshop (Bereinigen von Fehlern und Zuschnitt)
4. Krpano (Zerlegen des Fotos in Teile und html-5 Code erzeugen)
5. Notepad (Bearbeiten der XML Datei)
6. FileZilla (Upload auf Webspace)
Die gleiche Technik habe ich auch schon hier beim Makro eines Tannenszapfens angewendet.
Viel Spaß bei der Entdeckungsreise
Alle Einzelheiten habe ich auch noch nicht entdeckt.