(Literally) Drawing the HTML 5 Logo in Canvas with Javascript

I don't understand why people are impressed by HTML Canvas demos. It's like getting impressed by a calculator adding two numbers together. Or being impressed by a for loop statement in a language. Or being impressed by an fopen statement to read files.

A collection of drawRect, drawCircle and setBrushColor calls isn't impressive just because it's done in JS. That's what graphics libraries are supposed to do. Maybe I'm missing something here...

Re: (Literally) Drawing the HTML 5 Logo in Canvas with Javascript

#5

Post by richchan » Wed, Jan 26, 2011, 11:43 PM UTC

chaosmachine wrote: post #2

Click the redraw button a bunch of times while it's still drawing for an interesting effect.

Yep.. Apparently calling jquery ui's disable method doesn't disable the handler -- guess I should've read the docs...

Anyway, thanks for pointing it out. I will try to fix it when I get home. Before then, have fun with the "interesting effects". =)

Re: (Literally) Drawing the HTML 5 Logo in Canvas with Javascript

#6

Post by olalonde » Thu, Jan 27, 2011, 12:09 AM UTC

richchan wrote: post #5

chaosmachine wrote: post #2

Click the redraw button a bunch of times while it's still drawing for an interesting effect.

Yep.. Apparently calling jquery ui's disable method doesn't disable the handler -- guess I should've read the docs... Anyway, thanks for pointing it out. I will try to fix it when I get home. Before then, have fun with the "interesting effects". =)

How did you generate the "var levelX" arrays?

Re: (Literally) Drawing the HTML 5 Logo in Canvas with Javascript

#7

Post by ImJasonH » Thu, Jan 27, 2011, 1:11 AM UTC

ttol wrote: post #3

Increasing the sloppiness makes this way cooler. +1

I like upping the sloppiness on layers 2 and 4 to make a sort of "Two-Face" logo: http://imgur.com/z1iSH

Re: (Literally) Drawing the HTML 5 Logo in Canvas with Javascript

#8

Post by smackfu » Thu, Jan 27, 2011, 1:18 AM UTC

Cool, but needs a cancel button that stops drawing and re-enables the sliders.

Re: (Literally) Drawing the HTML 5 Logo in Canvas with Javascript

#9

Post by brehaut » Thu, Jan 27, 2011, 1:37 AM UTC

jinushaun wrote: post #4

I don't understand why people are impressed by HTML Canvas demos. It's like getting impressed by a calculator adding two numbers together. Or being impressed by a for loop statement in a language. Or being impressed by an fopen statement to read files. A collection of drawRect, drawCircle and setBrushColor calls isn't impressive just because it's done in JS. That's what graphics libraries are supposed to do. Maybe I'…

You have (understandably) been led astray by a poorly considered title.

The article demonstrates a vector based 'hand drawing' algorithm that happens to use the HTML5 logo and be implemented in javascript with canvas.

Unfortunately it doesn't appear to implement a generalised library for scruffy drawing.

Re: (Literally) Drawing the HTML 5 Logo in Canvas with Javascript

#10

Post by guynamedloren » Thu, Jan 27, 2011, 1:44 AM UTC

ttol wrote: post #3

Increasing the sloppiness makes this way cooler. +1

Increasing sloppiness on one half + hitting redraw a bunch makes the coolest: http://i.imgur.com/60dEI.png