Hallo allerseits,
nach vielen Mühen (auch im Gelände mit der Kamera und natürlich auch im Processing, das eine Rekordanzahl an verschiedenen Programminstanzen und Verarbeitungsschritten erreicht hat) steht endlich ein aussergewöhnlicher Timelapse-VR.
Leider stosse ich bei XML Programmierung nun an meine Grenzen, trotz der tollen Doku's von KRPano...
Hier der TL:
Grosse Version - knapp 200 MB gross - bitte Zeit lassen zu laden, wenn die Musik startet geht's los (kann durchaus mal 10 Minuten dauern bis das geladen hat, aber es startet wirklich), es gibt noch keinen Fortschrittsladebalken etc etc...
http://twanight.org/temp/pano.html
Kleine Version 45 MB
http://twanight.org/temp/small/pano.html
Verwendete Codes:
<krpano version="1.16">
<include url="skin/defaultskin.xml" />
<plugin name="video" url="videoplayer.swf" videourl="pano.mov" loop="true" />
<preview url="_DSC8861.tiles/preview.jpg" />
<image>
<cube url="_DSC8861.tiles/pano_%s.jpg" />
<mobile>
<cube url="_DSC8861.tiles/mobile_%s.jpg" />
</mobile>
</image>
<progress showload="bar()" showwait="loopings()" showreloads="false" parent="" />
<image>
<sphere url="plugin:video" />
</image>
<view hlookat="0" vlookat="0.0" camroll="0.0" fov="90.0" fovmin="0.0" fovmax="150.0" fisheye="0.0" fisheyefovlink="0.0" limitview="range" hlookatmin="-180" hlookatmax="+180" vlookatmin="-90" vlookatmax="0" />
</krpano>
Display More
und
<!DOCTYPE html><html><head> <title>christophmalin.com 360 timelapse VR</title> <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="x-ua-compatible" content="IE=edge" /> <style> @-ms-viewport { width: device-width; } @media only screen and (min-device-width: 800px) { html { overflow:hidden; } } html { height:100%; } body { height:100%; overflow:hidden; margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#000000; } </style></head>
<body>
<script src="pano.js"></script>
<div id="pano" style="width:100%;height:100%;"> <noscript><table style="width:100%;height:100%;"><tr style="valign:middle;"><td><div style="text-align:center;">ERROR:<br/><br/>Javascript not activated<br/><br/></div></td></tr></table></noscript> <script> embedpano({swf:"pano.swf", xml:"pano.xml", target:"pano", html5:"prefer", passQueryParameters:true}); </script>
<script> var viewer = createPanoViewer({swf:"pano.swf", target:"pano"}); viewer.addVariable("xml", "pano.xml"); viewer.embed();</script>
</div>
</body></html>
Was ich nicht schaffe (Wald vor lauter Bäumen nicht sehe):
- Ladefortschrittsbalken
- Multiresolution
- Video "Play/Pause" Button damit man sich auch mal in Ruhe umschauen kann
- Vorschau
Dass das Ding auch auf iPhone/iPad funktioniert ist warscheinlich eh unmachbar...
und gibt es eigentlich eine Möglichkeit so ein Video vor und zurückzuspulen?
Für Unterstützung wäre ich dankbar.
Herzliche Grüsse
C