Comments on: Drawling lines in JavaScript

By: themetroman

themetroman — Wed, 23 Dec 2009 14:04:44 +0000

hi,

I think Walter Zorn’s graphing package is fantastic

i hope you don’t mind me submitting a query – i am trying to create animation where lines are drawn with 2 second delays (a form of animation) – my code is as follows:

var jg = new jsGraphics(‘Canvas’);
jg.setColor(‘maroon’);
jg.drawLine(40,130,80,120);
setTimeout(‘jg.paint()’,10000);
jg.drawLine(80,120,120,110);
setTimeout(‘jg.paint()’,10000);

it draws everying thing at the same time i.e the setTimeout doesn’t work – any ideas ?

thanks

Abbey

By: Andi K

Andi K — Wed, 13 Dec 2006 05:28:34 +0000

It’s risky to do pixel graphics in JavaScript, like it’s bad to do pixel graphics in Java or other language that don’t optimize the process. Some years ago I build a JavaScript plotter for mathematical functions. I had to wait some minutes to create a 200x200px image. You should not use JavaScript to do this.
You should use SVG graphics although the browser with the blue E does not support this. This is a case you should use upcoming standards.

Is there a live demo?

By: Mario

Mario — Wed, 13 Dec 2006 00:43:05 +0000

Wow p01, your implimentation hardly uses any code at at. I love it!
Its so much simpler wow. I am floored.

By: Alexei

Alexei — Tue, 12 Dec 2006 02:16:46 +0000

I agree. Walter Zorn’s is fantastic.
Anyway.. one thing JS should not be used for is graphics. Can’t print it, can’t copy and paste it.. it’s just stuck there.

By: Guyon

Guyon — Mon, 11 Dec 2006 22:07:22 +0000

The main advantage of using s to draw graphics is it is more portable than the canvas methods. I’ve been experimenting with graphics for some time and have developed a library which I have used in a drawing application here… http://www.webreference.com/programming/javascript/gr/column22/index.html

By: Scott Schiller

Scott Schiller — Mon, 11 Dec 2006 19:29:37 +0000

p01! haven’t seen you around in a while, man. :)
(Listen to this guy – he’s very smart.)

By: Mathieu 'p01' HENRI

Mathieu 'p01' HENRI — Mon, 11 Dec 2006 18:08:03 +0000

A few years ago, I wanted to animate some 3D objects in wireframe in JavaScript. Bresensham wasn’t fast enough and lead to an unpleasant tag soup. So I came up with a slightly less accurate but much faster technique:

http://www.p01.org/articles/DHTML_techniques/Drawing_lines_in_JavaScript/

By: Karl G

Karl G — Mon, 11 Dec 2006 17:14:36 +0000

While jsgraphics does work, it’s not fast at all unless you’re using it for the simplest graphic elements. The current best way to draw lines is to use the canvas API and get IE support using the google excanvas.

By: Adrian

Adrian — Mon, 11 Dec 2006 15:12:18 +0000

Someone figured it out before:
http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm

I used this lib last year, it just plain rocks. It works extremely well and does a great job, fast and cross-browser. What else to ask?