Shape rotation : Canvas Draw « Dojo toolkit « JavaScript DHTML

Shape rotation

 

<html>
  <head>
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
      dojo.require("dojox.gfx");
      function testIt() {
        var s = dojox.gfx.createSurface("my", 320, 240);
        var t = s.createPolyline([ {x:160,y:15}, {x:110,y:65},{x:210,y:65}, {x:160,y:15} ]).setFill([0, 255, 0, 1]);
        
                
        window.setInterval(function() {
          t.applyTransform(dojox.gfx.matrix.rotategAt(5, 155, 50));
        }, 100);

      }
    </script>
  </head>
  <body onLoad="testIt();">
        <div id="my"></div>
  </body>
</html>

Dojo-toolkit.zip( 3,849 k)

Related examples in the same category

1.	Draw 3D ball
2.	Draw line
3.	Draw polygon
4.	Draw rectangle
5.	Draw stroke
6.	Draw text
7.	Fill text
8.	Create Ellipse