Javascript Projects

 

A maze generator using the backtracker algorithm (pseudo-code) . I used an iterative approach instead of recursively. My first implementation was using Java. This was my first attempt at using OO Javascript. I should have placed the methods of the Cell class on the prototype chain but I didn't so not sure how OO this implementation really is ... but it is what it is!

 

The idea behind this project came from Lode's Computer Graphics Tutorial website. I have no idea how I ever came across this website. I was obviously looking at something about computer graphics. One of the links on the page is for Sierpinski Fractals.

I ran into a small problem when drawing the lines. They kept coming out fat. I knew it had something to do with canvas but I couldn't figure it out. I almost gave up on it but then I came across this article: Resizing the HTML Canvas Element. And here is the paragraph that cleared everything up:


When you specify the size of the canvas's width and height attributes, you are specifying the size of the canvas's rendered area. When the size is specified via CSS, you scale the rendered area to match the defined CSS size. It is this discrepancy that results in the skewing that you see on your canvas.


Because at the time I wasn't specifying the canvas width and height attributes inside the canvas HTML tag I was grabbing the default values which are: canvas.width = 300 and canvas.height = 150.

What I thought I was doing was getting the values that I set in the CSS. But as I said above, I was getting the default values (300 x 150) and then scaling the rendered area to match the CSS size (400 x 400). No wonder stuff was coming out funky. I have since removed the width and height values in the CSS and put the size as an attribute inside the HTML canvas tag. I could (and probably should) just set the values inside the JavaScript function.

It is mistakes like this that drive me crazy but once I find out what is causing the problem (which is usually my lack of complete understanding of the subject I am working on) I usually don't make them again. It is for these reasons that actual programming will always trump just reading a book on how-to program.