36

After staring at this 3D cube and these triangles for a while I started wondering if there's any good reliable Javascript graphics library with basic 3D support.

Any suggestion?

flamingLogos
  • 5,971
  • 4
  • 37
  • 44
JohnIdol
  • 48,899
  • 61
  • 158
  • 242

7 Answers7

27

John Resig's port of the Processing library to Javascript:

http://ejohn.org/blog/processingjs

tonys
  • 3,855
  • 33
  • 39
  • This library is just beyond cool. This kind of visualization will be the future of the web, I think! – spoulson Oct 21 '08 at 13:55
  • the link appears to be dead... or it might be one of those days in cyberspace... – jldupont Dec 07 '09 at 20:57
  • Works fine for me. Must have been one of those days :-). – tonys Dec 08 '09 at 17:13
  • Wow, thanks I am wondering if I'll take the pain in learning Silverlight, a friend of mine was laughing when I told him that I was working with Javascript (EXT-js mainly), but JavaScript is clearly not near the end... – Tom May 24 '10 at 04:46
  • @Tom, who knows, maybe you'll be the last one to laugh ;) – Igor Brejc Nov 21 '10 at 11:26
  • Khan Academy recently released their really cool Computer Science tutorials using the Processing libraries. http://www.khanacademy.org/cs/docs – Trevor Allred Aug 20 '12 at 06:23
  • JavaScript has progressed tons since this answer was posted... and it's expecially nice with Hardware acceleration now... – trusktr Mar 15 '13 at 03:20
13

I'm very psyched about Raphaël. I've used it in one project and it works like a charm.

Guðmundur Bjarni
  • 4,082
  • 1
  • 18
  • 14
  • just curious: I'm still left a little short on what a practical use of browser-based vector graphics would be. I heard Dmitry (the author of raphael) talk a couple of months ago and was pumped about VGs, but I can't think of where I'd actually use it... – nickf Oct 26 '08 at 03:11
  • 1
    I used it to create a on-screen keyboard within a touch screen based kiosk web app. But graphs / plots come to mind as well. :) – Guðmundur Bjarni Oct 29 '08 at 14:16
8

Flot is a pure Javascript plotting library for jQuery.

Galwegian
  • 41,475
  • 16
  • 112
  • 158
4

Here are a few physics engines written in javascript that have some graphics capabilities.

http://blog.quantumstate.co.uk/javascript-physics-engine.html

http://box2d-js.sourceforge.net/

Steve Horn
  • 8,818
  • 11
  • 45
  • 60
3

Take a look at dojox.gfx: docs, tests, demos (last two links to the nightly snapshot on the test server optimized for debugging, not for production).

It uses native graphics: SVG, VML, Silverlight or Canvas — whatever is available on the client covering all major browsers (IE, Firefox, Safari/Webkit, Opera).

While it is 2D, it can be used as a foundation for 3D stuff. In fact there is a library that takes advantage of it: dojox.gfx3d. Examples (can be found in tests):

And for truly adventurous types there is a library done for Dojo as part of Google Summer of Code 2008: True 3D. Obviously it is much faster than 2D/3D hybrid, and suitable for fluid animation. You can explore it on your own (the previous link is a publicly available Subversion repository), but be warned: it works only on Firefox and Opera with special 3D graphics add-ons from respective vendors. You'll find all gory details in the documentation.

Have fun!

Eugene Lazutkin
  • 43,776
  • 8
  • 49
  • 56
1

Check out Walter Zorn's library

www.walterzorn.de/en

Community
  • 1
  • 1
Tad
  • 639
  • 5
  • 12
1

The canvas html element may be the best backing and is used as such in many libraries (I know flot and processingjs mentionned by sibblings are using it)

canvas element is the lower API abstraction level you can get, which may be conceptually similar to Cairo or GDI

smoothdeveloper
  • 1,972
  • 18
  • 19