Calling a function at certain interval of time

Here is the piece of code that helps you to update a function at certain interval of time. The time is usually calculated in milliseconds. As you can see the code has 1000 somewhere in the setinterval function. This code helps to call the function every second. Here in the first line you can see the ‘mainCanvas’. It is nothing but the id of HTML5 canvas.

var drawingCanvas = document.getElementById(‘mainCanvas’);
if(drawingCanvas.getContext) {
    /* Initaliase a 2-dimensional drawing context */
    var context = drawingCanvas.getContext(‘2d’);
    setInterval(“update()”,1000);

}

function update(){
//call the function which you want to update.

}

All right test the code and see the result. Happy Coding…. Smile

Advertisements

Code for drawing a line using Bresenham algorithm in Javascript

Here is the snippet for drawing a line in javascript.

function drawline(xa,ya,xb,yb){
    var dx=Math.abs(xa-xb);
    var dy=Math.abs(ya-yb);
    var p=2*dy-dx;
    var twody=2*dy;
    var twodydx=2*(dy-dx);
    var x,y,xend;

    if(xa>xb)
    {
        x=xb;
        y=yb;
        xend=xa;
    }
    else
    {
        x=xa;
        y=yb;
        xend=xb;
    }
    drawpix(x,y);
    while(x<xend)
    {
        x++;
        if(p<0)
        {
            p+=twody;
        }
        else
        {
            y++;
            p+=twodydx;
        }
        drawpix(x,y);
    }
}

As in previous blog you can find the code for pixel drawing code. Here is the link for the pixel drawing code. http://bit.ly/Wzm0xG

Go through it and happy coding… Smile

Drawing a single pixel on Javascript

well after a long procedure and searching for a whole day to draw a single pixel on a HTML5 canvas, this code as I wrote worked out to draw a single pixel.

function drawpix(x,y){

   var c1 = document.getElementById(“mainCanvas”);
   var rContext = c1.getContext(“2d”);
   rContext.beginPath();
   rContext.moveTo(x,y);
   rContext.lineTo(x+1,y+1);
   rContext.closePath();
   rContext.strokeStyle= ‘white’;
   rContext.stroke();
  

}

drawpix(10,10);