Three.JS by mrdoob is an HTML5/Javascript script for displaying 3D content on your webpages. It comes with a Blender 2.5 export script to generate the required Javascript file! Kikko explains how to use the script and export your models. Nice!
You're blocking ads, which pay for BlenderNation. Read about other ways to support us.
About the Author
Bart Veldhuizen
I have a LONG history with Blender - I wrote some of the earliest Blender tutorials, worked for Not a Number and helped run the crowdfunding campaign that open sourced Blender (the first one on the internet!). I founded BlenderNation in 2006 and have been editing it every single day since then ;-) I also run the Blender Artists forum and I'm Head of Community at Sketchfab.
24 Comments
ah I remember the good old web plugin that better than anything in our days too
Firefox 3.6.6: 17 fps
Chrome 5.0: 48 fps
Fedora 12 x86_64
Quite a difference. Firefox has a lot to do.
cool :)
Very cool :) !
panzi: "Firefox has a lot to do." it's done with fx4 ! I've got 41fps on Chrome and 31fps on firefox 4 (beta 1) but the display is better on firefox
And this is not even WebGL? Kinda cool.
pretty cool, good how is progressing.. i really don't like flash and swf.
There is also a WebGL Renderer. Although textures aren't working yet... Maybe over the weekend...
when are we going to see sunflow.sourceforge.net ported to javascript. That would be the beginning of true rendered internet collaboration.
New to this blogging but have some vast knowledge on future graphic trends.
That's amazing. I didn't know you could do real 3D with a Javascript library. I'll be following this.
SpfxGuy
wait what? Sunflow running online?
Well, won't take long...
http://29a.ch/2010/5/17/path-tracing-a-cornell-box-in-javascript
We just need a WebGl/Shader version of it :)
Mr. doob
any idea why the exporter does not show up on my os x build of Blender?
Build number is 30117
Here is the console error report:
7/9/10 4:36:38 PM [0x0-0x146146].org.blenderfoundation.blender[2031] File "/Applications/Blender/Blender 2.5/blender.app/Contents/MacOS/2.52/scripts/modules/bpy_types.py", line 580, in draw_ls
7/9/10 4:36:38 PM [0x0-0x146146].org.blenderfoundation.blender[2031] func(self, context)
7/9/10 4:36:38 PM [0x0-0x146146].org.blenderfoundation.blender[2031] File "//Applications/Blender/Scripts/io/export_threejs.py", line 200, in menu_func
7/9/10 4:36:38 PM [0x0-0x146146].org.blenderfoundation.blender[2031] default_path = bpy.data.filename.replace(".blend", ".js")
7/9/10 4:36:38 PM [0x0-0x146146].org.blenderfoundation.blender[2031] AttributeError: 'Main' object has no attribute 'filename'
Is that Blender 2.5?
yes of course !
Then, I'm afraid I don't :/
would it be possible to provide some code to control the camera and be able to fly around? or somehow export camera animation?????
Mr doob
check this: http://blenderartists.org/forum/showthread.php?t=191385
I was getting the same error here, on Ubuntu 9.10 with revision 30163.
Fixed it by changing "filename" in line 200 to "filepath".
However... when I try to export the default cube, I get:
Code:
RNA_string_get_alloc: EXPORT_OT_three_js.filepath not found.
Mr doob
some issue also on win7
File "C:\Users\claas\Desktop\Release\untitled.blend/export_threejs.py", line 2
00, in menu_func
AttributeError: 'Main' object has no attribute 'filename'
Traceback (most recent call last):
File "C:\Users\claas\Desktop\Release\scripts\modules\bp y_types.py", line 580,
in draw_ls
func(self, context)
File "C:\Users\claas\Desktop\Release\untitled.blend/export_threejs.py", line 2
00, in menu_func
AttributeError: 'Main' object has no attribute 'filename'
haha, I thought I was about to watch some sterescopic fun instead of a very low poly model... :p
Very interesting development. I'm getting 14 fps on FireFox (on an old computer), which is a bit slow. But this will probably improve as the development continues on this.
I'll be keeping an eye on it.
25fps firefox, 45fps safari Macbookpro 2.8 Ghz Core 2 Duo.
Super cool. This is going to offer lots of nice stuff.
Ubuntu 64bit
Chrome - 49
Opera - 45
Firefox - 21 :(((
http://lcharyzma.wordpress.com/2010/07/11/wydajnosc-przegladarek-w-javascript-3d/
With reference to Jonas Wagner's path tracing demo, his Normal mapping and phong shading demo is also fantastic: http://29a.ch/2010/3/24/normal-mapping-with-javascript-and-canvas-tag
Its still very early days for HTML5
You can max out OpenGL in a webpage using java.
example: http://have2chat.net/benchmark/fullpage.html