Parsing Collada 3D assets with JavaScript in the HTML 5 Canvas element
Posted by Dennis on Nov 21, 2007 in 3D, Speaking • 5 commentsA few weeks ago there was a “Fronteers” (the Dutch guild of front-end developers) meeting at our office in Utrecht. I was asked to give a talk about something interesting related to front-end web development. Quite a lot has been said and written about standards, accessibility, etc. so I had to come up with something more exotic.
I ended up giving a talk about the new <canvas> element from the HTML 5 specification. It’s still in its infancy but you can do some nice things with it. I won’t bore you with the details, but you can find more info about this tag at the bottom of this post.
Besides showing all the basic line drawing stuff I wanted to make something that’d be a bit more interesting to the eye. Since I already wrote a Collada parser for the Sandy 3D engine I thought it would be a good idea to see if I could make it work with the canvas tag & JavaScript. Despite of time limitations I was able to make it work acceptably. That said, it’s fairly buggy, not all 3D models parse correctly and there’s some ugly hacks in the code 
. You need Firefox 2 to watch it. Here it is, take a look!
Looks great! I will try too
Coll indeed. I wonder how many FPS can it run at with a 1000 of triangles? Or would it be SPF
is there a way to rotate the object or the camera looking at it? There are only x/y coordinates transformed in the project2D method.
its very good now i try it.
Did this parser of yours improved? I am looking for something to create modell-previews on my website (rotatable), but it is hard to find anything, and write one myself, well it would be way too much time learn anything needed.