DIR : /home/kozerus/public_html/htmout_ani2.html

/home/kozerus/public_html

<html> <!-- 1 -->
   <head> <!-- 2 -->
	<title>-= htmout_ani =- {} -= 20192015_0200 =-</title> <!-- 3 -->
       <!-- 4 -->
      <script type = "text/javascript"> <!-- 5 -->
         var pattern = new Image(); <!-- 6 -->
          <!-- 7 -->
         function animate() { <!-- 8 -->
            pattern.src = "/html5/images/pattern.jpg"; <!-- 9 -->
            setInterval(drawShape, 100); <!-- 10 -->
         } <!-- 11 -->
          <!-- 12 -->
         function drawShape() { <!-- 13 -->
             <!-- 14 -->
            // get the canvas element using the DOM <!-- 15 -->
            var canvas = document.getElementById("mycanvas"); <!-- 16 -->
             <!-- 17 -->
            // Make sure we dont execute when canvas isnt supported <!-- 18 -->
            if (canvas.getContext) { <!-- 19 -->
             <!-- 20 -->
               // use getContext to use the canvas for drawing <!-- 21 -->
               var ctx = canvas.getContext("2d"); <!-- 22 -->
                <!-- 23 -->
               ctx.fillStyle = "rgba(0,0,0,0.4)"; <!-- 24 -->
               ctx.strokeStyle = "rgba(0,153,255,0.4)"; <!-- 25 -->
               ctx.save(); <!-- 26 -->
               ctx.translate(150,150);  <!-- 27 -->
                <!-- 28 -->
               var time = new Date();  <!-- 29 -->
               ctx.rotate( ((2*Math.PI)/6)*time.getSeconds() + ( (2*Math.PI)/6000)*time.getMilliseconds() ); <!-- 30 -->
               ctx.translate(0,28.5); <!-- 31 -->
               ctx.drawImage(pattern,-3.5,-3.5); <!-- 32 -->
               ctx.restore(); <!-- 33 -->
            } else { <!-- 34 -->
               alert("You need Safari or Firefox 1.5+ to see this demo."); <!-- 35 -->
            } <!-- 36 -->
         } <!-- 37 -->
      </script> <!-- 38 -->
      </html>> <!-- 39 -->

koh5_pano

Drag mouse to navigate.

Navigation

Left/Right Mouse drag: Changes camera heading.
Up/Sown Mouse drag: Changes camera pitch.
Scroll wheel: Changes camera field of view.
I-Key: Displays Info panel with canvas size, image size and FPS.

17.Aug.2010, Martin Wengenmayer