This won't be answered in CS.
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

Question

This won't be answered in CS.
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<testInt+1;i++){

if(isEven(i)==true){
    var wColour = "#994c00";
}
else if(isEven(i)==false){
    var wColour = "#B87333";
}
ctx.beginPath();
ctx.strokeStyle = wColour;
ctx.lineWidth

compassionate · Answer

for(i=0;i<testInt+1;i++){

wwb00 · Answer

I'll try it.

wwb00 · Answer

some code got cut off. wait a sec.

wwb00 · Answer

ctx.beginPath();
    ctx.strokeStyle = wColour;
    ctx.lineWidth = linewidth;
    ctx.rect(llocation,300,length,250);
    ctx.stroke();
    ctx.closePath();
    var llocation = llocation + linewidth;
    var length = length - (linewidth*2);
}

wwb00 · Answer

It's still not working.

compassionate · Answer

No need for the { attached to the end. Try spacing it

wwb00 · Answer

Ok

compassionate · Answer

for(i=0;i<testInt+1;i++){


Might help to change it to 

for(i=0;i<testInt+1;i++)

{

wwb00 · Answer

Still did'nt fix.

wwb00 · Answer

Ill post all of my files.

compassionate · Answer

Hmm... @dan815  @goformit100 @mathmale

wwb00 · Answer

attachment

wwb00 · Answer

It won't let me post the other because of "forbidden" script

compassionate · Answer

You should try asking this question on Yahoo Answers

wwb00 · Answer

I am.

wwb00 · Answer

And stack overflow.

anonymous · Answer

Have you got any HTML to go with this? Saves me the trouble of making some to fit your script.

wwb00 · Answer

I do, but it won't let me post it.

anonymous · Answer

Also, this is unnecessary: 

    if(isEven(i)==true) {
        var wColour = "#994c00";
    }
    else if(isEven(i)==false){
        var wColour = "#B87333";
    }

There's no point evaluating isEven(i) == false because if you've already found that it's true then this must be false. Just get rid of "if(isEven(i)==false)"

wwb00 · Answer

Canvas

Home

Rectangle

Circle

Canvas Practice

House

anonymous · Answer

Thanks. Is your isEven function defined elsewhere? No need to post it if it is, just checking it does actually exist.

wwb00 · Answer

It works now!!!

wwb00 · Answer

Thank you all!!!

wwb00 · Answer

I can't give two best responses...

wwb00 · Answer

sorry Compassionate

anonymous · Answer

I was going to say, this code is working fine for me in JSFiddle: https://jsfiddle.net/4rhuf2kd/ For future reference, browser developing tools help massively when debugging JS. In Chrome, press F12 and you'll get the dev panel at the bottom. View the console and see what errors are there when you view your site, for me it said "Uncaught ReferenceError: isEven is not defined".

wwb00 · Answer

Thanks!

wwb00 · Answer

I have another problem now.

wwb00 · Answer

This code won't run in a function.

wwb00 · Answer

wwb00 · Answer

wwb00 · Answer

attachment

wwb00 · Answer

There is nothing wrong in the terminal.

anonymous · Answer

Just curious, why do you define each function then run them straight away? Might as well save yourself the declaration and just have one long block of code - unless you need to call them specifically elsewhere or you've been asked to do it this way specifically.

wwb00 · Answer

I wanted to have a functions reference, then a code that runs in a simplified manner. If this were to work, I would make local variables for the function.

anonymous · Answer

Okay, I understand. What exactly are you expecting this code to do? It's showing a blue rectangle on top of a green one for me.

wwb00 · Answer

That's the background. It's to make a landscape.

wwb00 · Answer

The house is not displaying

okdutchman7 · Answer

Could please post this in Computer Science?

wwb00 · Answer

There are very few people on that section. Thank you tom982

anonymous · Answer

Give me a second, I've given up with JSFiddle, going local now.

wwb00 · Answer

Ok

wwb00 · Answer

The house works perfectly not as a function.

wwb00 · Answer

I just got a tip from another section that it may be a scope issue with wColour

wwb00 · Answer

I fixed the scope, but it still won't draw the obj.

wwb00 · Answer

wwb00 · Answer

remove alert(wColour) it was for diagnostic purposes.

wwb00 · Answer

I fixed it.
All the variables had the wrong scope!

wwb00 · Answer

Thanks so much!

wwb00 · Answer

anonymous · Answer

Great, this was driving me mad.

wwb00 · Answer

I gave you the code you you can see it work. As we both have wanted.

anonymous · Answer

Ah I see the problem now, and sorry but your fix isn't very tidy. In Javascript, if you want to access a variable outside the scope of the function you have to make sure you don't use 'var'. Simply removing var from the variables you used in drawHouse() fixes this: https://jsfiddle.net/z0ranjdh/