Importing 3DS models

Python 3 converter

For security reasons writing to a file is forbidden for JavaScript. To convert 3D models in the OBJ format you can use Three.js and convert_obj_three.py (Python 2 based converter by AlteredQualia). I used this converter as prototype for a small convert_obj.py Python 3 based converter. You could try to make your own converter on the base of these two.

Toru Miyazawa models

Toru Miyazawa (Toucan VRML Museum) has more then one hundred of beautiful free 3DS models. I use Blender 2.49 to convert these 3DS models to the simple OBJ file format (see Wavefront .obj file Wiki). Models data are very simple because materials are not used (one texture only). Vertices, normals and texture coordinates are stored as plain text. Faces (triangles) indices are stored as
f 6/4/1 3/5/3 7/6/5
and may be parsed easily. To make a model import it in Blender. Join objects if necessary (click model by the right mouse button, press the A key twice then Object/ Join Objects (or Ctrl-J)). Make it smooth (Link and Materials/ Material/ Set Smooth). Export as Wavefront.obj with normals.

Then use a simple JS based converter (for local use with Firefox). This script makes JS arrays for data with given precision, "aligns" number of normals to number of vertices and discards indices of normals. You can just copy result and put it in your WebGL script (use e.g. tex_model.html) or add one more JS file with these data. Don't forget to set new texture name and it is flipped vertically when is converted to a gif.

Numbers. To store "kotyou" data as a binary file one need
    10634(vertex number)×6(vertex+normal coordinates)×2b = 128 Kb
    51282(indices)×2(vertex+texture)×2b = 205 Kb

Compressed (uncompressed) html file sizes are 267 (985) kb. So compessed html is rather compact (do not know how binary files are compressed).

At first I used solid meshes with per face normals. Data was more compact as since normals were generated by JS but models was crumpled as you can see in the old picture above.

VRML rose size is only 45 kb because normals are generated by VRML plugin and rose is made of many similar "instanced" petals.

3DS models with materials

One more mat_convert.html converter adds extracted materials (diffusive and specular colors) from MTL files. With a piece of luck you can insert the data in the mat_model.html prototype.

Importing spline based models

For spline based (e.g. sPatch) models use spline_convert.html converter for "RenderMan" RIB files. This script makes JS array with spline patches data (it copies 4×4×3 = 48 floating numbers from strings starting with "Pa")
Patch "bicubic" "P" [-0.703050 -0.638339 ... 0.440210 ]
Then you can put result in your WebGL script (use e.g. spline_model.html prototype).

Spline based models are more smooth and compact than triangular meshes and accurate normals are calculated easily. Sometimes there are small defects in these models (as I think) for degenerate Bezier patches (e.g. triangular) when some control points coincide, partial derivatives are zero and normals are indefinite.


WebGL and simulations on GPU     Evgeny Demidov   mail: demidov at ipm.sci-nnov.ru
updated   8 Apr 2013