DIR : /home/kozerus/public_html/pn/HTML5pano/index.html

/home/kozerus/public_html/pn/HTML5pano

<html>
  <head>
    <meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type">
    <script type="text/javascript" src="html5pano.js"></script>
  </head>
  <body onload="init_pano('canvas')">
    <div align="center"> <br>
      <br>
      <h1>HTML5 panorama viewer Javascript</h1>
    </div>
    <div align="center"> <br>
      <br>
      <canvas id="canvas" width="640" height="480">
        <p>Your browser does not support the HTML5 canvas element.</p>
      </canvas> <br>
      Drag your mouse to navigate through the panorama. </div>
    <div style="padding:50px;" align="left">
      <h2>Description</h2>
      Experimental HTML5 panorama viewer using the new HTLM5 canvas element.
      This script displays equirectangular (360x180) panoramas. So just one
      image is necessary to display a complete 360x180 panorama.
      <h2>Purpose</h2>
      I mainly was curious how fast equirectangular panorama image can be
      displayed with a HTML5 canvas. So the script isn't cleaned up very well,
      but it gave me at least an idea that it is possible. On my an Intel Core
      i7 CPU I get more than 20 frames per second. That is of course not very
      fast but usable. And the best of all it doesn't require any Plug-Ins :)
      <h2>Navigation</h2>
      <ul>
        <li>Left/Right Mouse drag: Changes camera heading. </li>
        <li>Up/Sown Mouse drag: Changes camera pitch. </li>
        <li>Scroll wheel: Changes camera field of view. </li>
        <li>I-Key: Displays Info panel with canvas size, image size and FPS. </li>
      </ul>
      <h2>Requirements</h2>
      I've tested this HTML5 panorama script with the latest versions of Safari,
      Firefox and Chrome on Mac OS X. But it should also run on other platforms
      supporting HTML5. <br>
      <br>
      <h2>License</h2>
      The html5pano.js script is released under the Simplified BSD License.
      Please see comments within the script.<br>
      <br>
      <h2>Dowload</h2>
      Please use the following link to download the script including a sample
      panorama image. <br>
      <br>
      &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;
      &nbsp;&nbsp;&nbsp; <a href="http://www.cheetah3d.com/download/HTML5pano/HTML5pano.zip">http://www.cheetah3d.com/download/HTML5pano/HTML5pano.zip</a><br>
      <br>
      <br>
      <br>
      <br>
      <a href="http://cheetah3d.com">17.Aug.2010, Martin Wengenmayer</a> </div>
  </body>
</html>
//


koh5_pano



Your browser does not support the HTML5 canvas element.
Drag mouse to navigate.

Navigation





17.Aug.2010, Martin Wengenmayer