jQuery addClass example

Change class name on click in jQuery

by josekerekes

HTML

<canvas id="desen" height="500" width="800"></canvas>

CSS

canvas {
  border:1px solid blue
}

JavaScript

var desen = document.getElementById('desen');
var ctx = desen.getContext('2d')

/* ctx.fillRect(400,250,1,1); */

function putPoint(x,y){
	ctx.fillRect(x,y,1,1)
}

function drawLine(x,y,size) {
	for (var xc = x;xc < x + size ; xc++) {
  	 putPoint(xc,y)
  }
}

function drawVLine(x,y,size) {
	for (var yc = y;yc < y + size ; yc++) {
  	 putPoint(x,yc)
  }
}

/* drawLine(40,20,100);
drawVLine(40,20,50); */

function drawPlus(x,y,length) {
	for(var d=0; d<length;d++) {
  	putPoint(x+d,y);
    putPoint(x,y+d);
    putPointt(x-d,y);
    putPoint(x,y-d);
  }
}

/* drawPlus(150,150,100) */

function drawSquare(x,y,lat){
	for(var d=0; d<=lat;d++) {
  
  	putPoint(x+d,y);
    putPoint(x,y+d);
    
    putPoint(x+d,y+lat);
    putPoint(x+lat,y+d);
    
  }
}

/* drawSquare(50,50,50); */

function drawCross(x,y,lat){
	for(var d=0; d<=lat;d++) {
  
  	putPoint(x+d,y+d);
    putPoint(x-d,y-d);
    putPoint(x-d,y+d);
    putPoint(x+d,y-d);
    
  }
}

/* drawCross(50,50,50);*/

function drawRectangle(x,y,lung,lat){
	for(var d=0; d<=lung;d++) {
  	putPoint(x+d,y);
    putPoint(x+d,y+lat)
  }
  for(var d=0; d<=lat;d++) {
  	putPoint(x,y+d);
    putPoint(x+lung,y+d)
  }
}

/* drawRectangle(10,10,400,100); */

function drawCircle(x,y,r) {
	for(alpha=0;alpha<=360;alpha++) {
  	var px = r * Math.cos(Math.PI * alpha/180);
    var py = r * Math.sin(Math.PI * alpha/180);
    var xc = x + px;
    var yc = y + py;
		putPoint(xc,yc);
  }
}

drawCircle(200,200,150);