Drawing with Canvas (html)

Lets take a look at learning how to draw with canvas, this is just a starter lesson.
If you want to see the rest let me know, or i could just post the code on sq bracket in a month or two

Category:

Science & Technology

Tags:

• canvas
• html5
• html
• drawing
• ctx
• draw
• rectangle
• game
• javascript
• dom

[xexoristo]

Boom!

[optikalefxx]

@xexoristo boom!

[alletbodasvideos]

All that fucking code for simple animation! This is bullshit. Why can't anyone develop a stable Flash-like timeline UI for HTML?

[optikalefxx]

@alletbodasvideos this is the raw stuff. You could easily make a simple drawing class that would give you the same functions flash uses.

[hd6ashlea]

It works right up to the point that I do the

$(document).keydown(function(e­){

console.log(e.keyCode);

});

after that the box I put on vanishes and I get a blank canvas... Any ideas?

[optikalefxx]

@hd6ashlea it must be drawing the clear rectangle and not drawing after that.

If you PM your code so far i can see whats going on.

[alletbodasvideos]

@mshartz5 there's tons of crappy programming too, so it goes both ways.

[mshartz5]

@alletbodasvideos

Because then the internet will be flooded with even more garbage that hogs unnecessary resources because it was created by graphic artists instead of programmers.

Remember that making things easier to use leads to more crap being made.

This is what I will be fearing with HTML5.

[xexoristo]

@optikalefxx Nice Job Mate!

[NewVillageDC]

Could you explain, how to make button on html page to draw canvas, or change color etc.

Thanx in adnavce!

p.s. make more videos :)

[TheBuddyboy35]

Please make the next tutorial showing how to allow for holding of keys.

[alletbodasvideos]

@optikalefxx. thanks for the comment and sorry if i sound frustrated, but all I want is to load sequences of frames so they play back at a specific frame rate. very much like a flipbook. any info on how to do this would be greatly appreciated.