Question

HTML Canvas Function

I have been writing some HTML canvas code in order to make a landscape. The code will not execute properly. What is my syntax error? Thanks, Benjamin

var canvas = document.getElementById("mycanvas");
var ctx = canvas.getContext("2d");
var llocation = 600;
var length = 360;
var linewidth = 2;
var testInt = length/(linewidth*2);
var wColour = "#994c00";
for(i=0;i 10 years ago

Answer 1

The variable i in the for loop header needs a var before it
```
for(var i=0;i<testInt+1;i++)
```

And for this part
```
if(isEven(i)==true){
var wColour = "#994c00";
}
else if(isEven(i)==false){
var wColour = "#B87333";
}
ctx.beginPath();
ctx.strokeStyle = wColour;
```
The variable wColour does not exist outside of your if/elseif statement blocks / curly brackets {}. This is called 'scope'.
```
else if(isEven(i)==false){
var wColour = "#B87333";
//wColour exists here
}
//wColour no longer exists
```

pretty clear html canvas example:
http://www.w3schools.com/HTML/html5_canvas.asp

Answer 2

I'll try it Thanks!

Answer 3

How do I fix the wColour issue? it is declared earlier in the function.

Answer 4

That's my bad, I didn't see you declare wColour up above those if/else statements. Syntactically, in javascript, looks good. Perhaps my mind is still too java, I see var x = 1; and I tend to immediately think x is being declared for the first time lol.

```
ctx.beginPath();
ctx.strokeStyle = wColour;
ctx.lineWidth
```
Looks good, except you don't appear to be setting lineWidth to a value; and I assume your isEven() function is elsewhere.

Here's a bit of sample code you might find helpful to play with:
http://jsbin.com/yuxiroqexu/edit?html,js,output