javascript - Random Objects in Canvas -


i created canvas , want add ramdomly objects(square, circle, rectangle..) in every 5 second?

  <body>     <canvas id="c" width=400" height="400"></canvas>     <script type="text/javascript">   var canvas = new fabric.canvas('c'); var rect = new fabric.rect({   left: 50,   top: 50,   fill: 'green',   width: 40,   height: 80 }); var circle = new fabric.circle({   radius: 20,    fill: 'red',    left: 100,    top: 100 }); canvas.add(rect); canvas.add(circle);      </script> 

take @ fiddle example , think need.

http://jsfiddle.net/tornado1979/w1bg4bdj/

the code this:

 var canvas = new fabric.canvas('c'); var myobjects = ['circle','square','rectangle','arc']; var posx; var posy;  setinterval(function () {      var pointer = myobjects.length * math.random();      posx = canvas.width * math.random();      posy = canvas.height * math.random();      pointer = math.round(pointer);      switch (pointer){         case 0:             var circle = new fabric.circle({                   radius: 20,                    fill: 'red',                    left: posx,                    top: posy                 });             canvas.add(circle);             break;         case 1:              var obj = new fabric.rect({               left: posx,                top: posy,               fill: 'green',               width: 40,               height: 80             });             canvas.add(obj);             break;         case 2:             var square = new fabric.rect({               left: posx,                top: posy,               fill: 'yellow',               width: 50,               height: 50             });             canvas.add(square);             break;         case 3:               var arc = new fabric.circle({                   radius: 45,                    originx:'center',originy:'center',                   angle: 0,startangle: 180, endangle: math.pi,                   fill: 'blue',                    left: posx,                    top: posy                 });             canvas.add(arc);             break;     } },    1000); 

Comments

Popular posts from this blog

java - Could not locate OpenAL library -

c++ - Delete matches in OpenCV (Keypoints and descriptors) -

sorting - opencl Bitonic sort with 64 bits keys -