Friday, March 1, 2013

3ds model viewer in WebGL

Usually WebGL libraries like three.js provide conversion tools that convert the input 3ds model to either obj and then into JSON format. Here I present my solution to load the binary 3ds model file directly in WebGL. Here is a live demo of my library.


Try the full screen version: https://dl.dropbox.com/u/5513476/3dsViewer/3dsViewer.html
Controls are:
Left click and drag to rotate
Middle click and drag to zoom in/out

Of course comments and critics welcome. I want to know what the feedback is before and go ahead and implement it as a full fledge 3DS loader.
Currently, the model is diffusely shaded with gray material. I am currently working to load the materials as well as textures. I am planning to make it a full fledge 3D modelviewer and will work on it as soon as I find some more time. Here are some snapshots from the viewer.

 

15 comments:

Κωστής Κωνσταντινίδης said...

Hello my friend! Nice work and promising alot!

So here is the deal, I have big models with materials and everything, that are produced from a software we have created for concrete buildings...

You can see it here: here I am This our work. So, we want to make this digital book 3D capable for the average user, that of course he should pay a little something to see the 3Dversion.

Do you think your very nice work could be helpful? Do you have something in mind? You look like a very "into the thing guy" so I feel lucky finding you after googling for almost a week to find such a clever solution!

Costis K.

Muhammad Mobeen Movania said...

Hi Friend,
Thanks for the nice comments. Actually, your work looks very promising indeed. Can your application output conventional object formats like .obj, .3ds etc. If that is the case, you can directly the code that I have shared above. Otherwise, you will have to manually create a loader in WebGL which should not be that difficult.

Let me know how it goes. In case you want me to help you out, you can give me a private email on my gmail account (mmmovania at gmail dot com).

Thanks,
Mobeen

Karthik B.R said...

Hi, can you please update the code, such that files are loaded from the server itself. i.e not allowing user to select the file.

Muhammad Mobeen Movania said...

Hi Karthik,
I wanted to give the flexibility for the user to load their own 3ds model files. Rest assured I don't copy your meshes anywhere. Are you concerned about this?

Maricar Gomez said...

This is great..



Email storage

Peter Alexay said...

Great tool, please keep up the good work and support also the materials (and textures).
But the keyframes are not important.

BTW: I'm an avid fan of your OpenGL-book at Packt ;-)
Good work,
kr,
Peter

Muhammad Mobeen Movania said...

Hey Peter,
Thanks for the support and appreciation. I am glad you like my OpenGL Development Cookbook.

I will certainly extend the 3DS loader for WebGL perhaps give it out as a model format for three.js but that needs some time. I definitely have this in mind.

Regards,
Mobeen

Riccardo Volpe said...

Very nice the possibility to load 3ds files with textures directly... I'm searching for that, finding you just now! Lucky me :-)

Riccardo Volpe said...
This comment has been removed by the author.
Muhammad Mobeen Movania said...

Hi Ricardo,
Great to know it is useful for you. Currently, I have not implemented loading of textures but that is a piece of cake. I will do it if there are more request or possibly release this as an opensource lib.

Thanks,
Mobeen

Leo de candia said...

Hi,
are there any updates on textures or colors on 3ds objects?
is there some documentation on how to do this?

Muhammad Mobeen Movania said...

Hi,
I have done texture loading and colors but have not linked it to the blog yet. The version shown here is a simple mesh loader without colors/textures. I did not find time to extend it further.

Thanks.
Mobeen

Muhammad Mobeen Movania said...

I will work on this if there is interest from many users.

Airaleais said...

there is interest from many users =(

Muhammad Mobeen Movania said...

Hi Airaleais,
I have completed the 3DS loader with texture mapping as well as all 3dsmax material browser tiling settings as well as all hierarchical including informaition of animation tracks. I will upload a public version soon when I will be free.

Thanks for your interest in this.

Regards,
Mobeen

Popular Posts

Copyright (C) 2011 - Movania Muhammad Mobeen. Awesome Inc. theme. Powered by Blogger.