setTimeout declaration

[Amit20]

Hello!

 

I m using setTimeout() method to call a function after some delay.

 

function i m calling is draw(x);

 

 

Now the problem is the function being called is parameterized function. So when i pass parameter to function in setTimeout method the page runs the draw method.

 

 

function draw(x)
	{
	var canvas1=document.getElementById("mycan");
	var context1=canvas1.getContext("2d");

	var i=x;
	document.write("i is" +i);
	var j;
	if(i<=300)
	{
	context1.moveTo(400,i);
	j=i+20;
	context1.lineTo(400,j);
	context1.lineWidth=2;
	context1.stroke();
	i=j;
	document.write("j is" +j);
	setTimeout(draw(i),1000);
	document.write("Calling draw again")
	}
	}

	function init()
	{
	setTimeout(draw,10000);

	document.write("Calling Draw");
	}

	window.onload=init;

[Amit20]

i need to call setTimeout() as

 

setTimeout(draw(500),5000);

[Adam]

You can use an anonymous function:

 

setTimeout(function() {
     draw(500);
}, 5000);

[Amit20]

I tried the anonymous function now i m getting an error:

 

 

 

Uncaught TypeError: Cannot call method 'getContext' of null

 

I guess canvas tag is loaded by the time i m calling my function!!!

[Adam]

The error suggests that canvas1 is null. Are you retrieving it correctly?

[Amit20]

I m retrieving it correctly.

 

Now i m  calling the draw unction recursively to draw the desired line.

 

When it is called first it time it does not draw the desired line and again when the function draw is called it gives me the same error i.e

 

Uncaught TypeError: Cannot call method 'getContext' of null

[AyKay47]

 if (typeof window.G_vmlCanvasManager!="undefined") { //check to see if we're in IE emulating Canvas 
                        canvas=window.G_vmlCanvasManager.initElement(canvas); 
                } 

[Adam]

 if (typeof window.G_vmlCanvasManager!="undefined") { //check to see if we're in IE emulating Canvas 
                        canvas=window.G_vmlCanvasManager.initElement(canvas); 
                } 

 

Care to explain your reason for this post?

 

When it is called first it time it does not draw the desired line and again when the function draw is called it gives me the same error i.e

 

Do you mean that on the second call it starts to give off the error? Try adding an IF statement around it:

 

if (canvas1.getContext) {
    var context1=canvas1.getContext("2d");

    // ... rest of code here
}

 

That would prevent multiple calls to getContext() - though this is my first encounter with it to be honest.

[AyKay47]

yeah, sorry MrAdam, OP I would suggest wrapping createElement and initialize it

 

var cnvs = document.createElement('canvas'); 
window.G_vmlCanvasManager && (cnvs = G_vmlCanvasManager.initElement(cnvs)); 

[Adam]

I just meant explain what the code is for..

[AyKay47]

I just meant explain what the code is for..

of course sorry, that code is meant to check to see if the canvas element is emulated in the browser, IE seems to have problems with the canvas element, need to force it, however I do not know what browser the OP is using so it's hard to pinpoint the exact issue.

[Amit20]

Friends i m using google chrome.

 

I know IE doesn't support HTML5  so i m avoiding it. I have downloaded excanvas for IE but let me get through this error first. Then i'll test in IE.