User:Roelroscama/Canvas

From XPUB & Lens-Based wiki

Counting In Public Space

Counting stacks on the block together with your good friends
l.jpg

additional information here and here and here

Canvas tryouts

first try
second try (using loops to create a spectrum of colours)
third try I got stuck with this one. The goal was to create a shape by rotating a single line using if statements. No rotate functions.


<canvas id="canvas1" showsrc>

 function init(){
       var canvas = document.getElementById('canvas1');
       var ctx = canvas.getContext('2d');
       var width = canvas.width;
       var height = canvas.height;
       var y = 200;
       var x = 10;

var rectSize = 10;

for(var h=0;h<80;h++) { var xPos=x*i;

       for(var i=0;i<80;i++) {

var yPos =(x+1)*i;

for (var j=0;j<80;j++){

           ctx.fillStyle = 'rgb('+4*h+','+4*i+','+4*j+')'

ctx.fillRect((x+1)*j,yPos,rectSize,rectSize); } }

       }
   
 }

</canvas>