3DNP 1.2a - a 3D viewer that needs no plugins

[thoro]

Hi,

some of you might have seen this in News & Chat, but I think this tool is ready for Finished Projects now .

3DNP is a free JavaScript based 3D viewer that comes with a Blender Python script to create a matching camera path:


You will find a demonstration and the full package on my website. Just grab the 3D object with your mouse and rotate it.



Feel free to use 3DNP and share your results in this thread.

I plan to improve the Python Script within the next days, the Script will get a GUI and some parameters to become more flexible...

Cheers

Thorsten

[[Kothe]]

Kind of slow, but it's so... cool!

[Yeonil]

what formats are supported? if the images are well compressed, it shouldn't make problem. (how many for one showthingy?)

Yeonil

[Roger]

looks promesting, the blender web plugin was cool but perhaps this is more handy (if it will work properly and be a bit faster )

[=KH=Lupus]

I'm trying to figure out how to get it to load my pics instead of the cube ones, but I'm afraid I'm a bit thick
Could someone please tell me how to do it? And also how do I upload the whole thing to my webpage?

Cheers

[mrfranz]

Good job ! it's perfect for presenting our blender model

[Trident]

Advanced JS working in Opera. Miracle.

[jimmac]

Thanks for the neat Quicktime VR, man. The javascript viewer is rad.

[=KH=Lupus]

How do you get to view the images? I can render them all out but after that I'm stuck.

[thoro]

[Kothe]: Thanks. Hehe, slow? You mean the loading time?

Yeonil: It runs in a standard browser, so images should be JPG, GIF or PNG. The amount of images is up to you.

Roger: Yes, the Blender plugin was very cool - I hope it will be back sometime...

=KH=Lupus: You have to load your Blender scene, delete the camera and append some Objects from the 3DNP.blend file (SHIFT-F1):

/Object/Camera
/Object/Camera.target
/Text/3DNPcam.py
/Text/3DNPmakepath.py

Now open a text editor (SHIFT-F11), select the '3DNPmakepath.py' Script and run it (ALT+P). There should be a new object called 'CameraBoss' now.

In a Buttons Window open the 'Script Links' panel and add a Scene scriptlink (FrameChanged) to '3DNPcam.py'. The camera should follow the vertices of the CameraBoss now using the Camera.taret as TrackTo constraint.

You can scale the CameraBoss sphere to match the size of your scene. Set your render range from 1 to 252 and hit Anim .

Sounds a bit complicated, but I plan to add some of these steps to the Python script '3DNPmakepath.py'.

Put the rendered images into the 'image' folder and look for the right filename settings in 3DNP.html. I used 4 digit framenumbers (like Blender does). You also have to set the 'total' value to 252 if you are using all rendered images.

mrfranz: Thank you!

Trident: It IS working in Opera? Really? Wow!

jimmac: You're welcome . Thanks!

=KH=Lupus: I guess you have to verify 'total', 'filename' and 'suffix' settings in 3DNP.html. Let me know if it works, and show us what you did . I don't care, just DO IT!

[Trident]

Originally Posted by thoro Trident: It IS working in Opera? Really? Wow!

Perfectly (Opera 7.54 on Win XP). Ok, in fact there once was strange global slowdown of the browser during image preload but i'm not sure if it is related to Opera or just my system/internet connection.

[=KH=Lupus]

All I did was append my model into the .blend file you gave to make things easier hehe. It rendered out the 252 png images with the same names as in the images folder (frame_0001 etc.). I just copied my images into the folder over them. I've set total to 252, levels to 7 but didn't change filename since it is the the same.
But for some reason when I double click 3dnp.html now it just shows a grey page, it doesn't show the loading image or anything. If I move the cursor to the area the image will show it changes to the hand icon, but still doesn't show anything even when I click and move the mouse. Any ideas?

EDIT: Ok got it to work, just need to upload it to get it on my website now.

[venomgfx]

Hey great work thoro!!

I made a test with one of my characters, this is what i get:

http://www.gallery.venomgfx.com.ar/merlin

I think that i'm gonna use this script a lot =)

Thanks for share it with us, and make it free!! =)
venomgfx

[Mini]

Great script. I imagine it will be widely used.

[Roger]

=KH=Lupus: You have to load your Blender scene, delete the camera and append some Objects from the 3DNP.blend file (SHIFT-F1): /Object/Camera /Object/Camera.target /Text/3DNPcam.py /Text/3DNPmakepath.py Now open a text editor (SHIFT-F11), select the '3DNPmakepath.py' Script and run it (ALT+P). There should be a new object called 'CameraBoss' now. In a Buttons Window open the 'Script Links' panel and add a Scene scriptlink (FrameChanged) to '3DNPcam.py'. The camera should follow the vertices of the CameraBoss now using the Camera.taret as TrackTo constraint. You can scale the CameraBoss sphere to match the size of your scene. Set your render range from 1 to 252 and hit Anim icon_wink.gif. Sounds a bit complicated, but I plan to add some of these steps to the Python script '3DNPmakepath.py'. Put the rendered images into the 'image' folder and look for the right filename settings in 3DNP.html. I used 4 digit framenumbers (like Blender does). You also have to set the 'total' value to 252 if you are using all rendered images.

There is no need to do all this.

Just download the program,
unpack it,
start the .blend file,
create or import your own scene,
press alt+P with the mouse over the text window,
press ANIM (in F10 to render the scene)

Now there will be the images just rendered in the right directory and when you'l run the html file, life is good.

[thoro]

Originally Posted by Roger There is no need to do all this.

Hehe, I know - not for a standard scene - but it can be a good way if your existing scene has it's own script links etc. (or maybe I just don't know how to import a COMPLETE scene with all these settings)? . This was just the secure way - and it is what I want the final Python script to do. But thanks for mentioning the easy way, maybe I should just stop to think like a Python script .

venomgfx: Hey, that's sweet! Are you going to make a 3D gallery? That would be so nice with all your cute characters.

Mini: Thanks - I hope so .

=KH=Lupus: Ah, you made it... can't wait to see the result.

Trident: It might be that the excessive opening of files slows it down .

[jjinkou2]

great script.
anybody knows how to use it within powerpoint?

[thoro]

jjinkou2: Thank you. There is a freeware utility called LiveWeb by Shyam Pillai. It's made for Windows and lets you embed HTML objects into your presentations. I tried it and it works with 3DNP. I think it's a great tool, the only thing that bugs me is that it shows a vertical scrollbar, but I will try to find out how to disable this. I wrote an email to the Author and asked him how to get of the scrollbar ...

Edit: Stupid me, I found the cause for the scrollbar - I had to disable them in my CSS definition :-|. I updated the 3DNP ZIP file on my website. Or you can just edit the CSS definition in your 3DNP.html:

body { background-repeat:no-repeat; overflow:hidden; margin: 0px; padding: 0px; border-style:none; }
html { overflow:hidden; border-style:none; }

Works perfectly now.

[Job]

What do i have to do after i've pressed anim?

how do i upload this on the internet?

[thoro]

The 3DNP-ZIP-file includes a folder called '3DNP 1.1'.

You have to put your rendered images into the subfolder named 'images' and have to set the variables inside the '3DNP.html' file. The '3DNP.html' should display your rendered object now.

If this works, you can upload the whole 3DNP 1.1 path to your webserver and can either open the 3DNP.html in a popup window or integrate it using an IFrame:

<iframe src="3DNP.html" width="300" height="300" hspace="0" vspace="0" scrolling="no" frameborder="0" name="3DNP">

Your Browser is not capable of displaying IFrames. Please use this link.</p></iframe>