mrdoob / three.js

JavaScript 3D Library.
https://threejs.org/
MIT License
101.9k stars 35.32k forks source link

Model import and API questions #2627

Closed trevex closed 11 years ago

trevex commented 11 years ago

I just started writing a md5 importer for Three.js and I am currently simply loading the first mesh defined in the .md5mesh file and add the associated informations to a THREE.Geometry instance, but how would I add multiple meshes to a single geometry?

Also where would I add joints, weights and uv data to the geometry and textures?

Sorry for bothering you guys, I am new to three.js and couldn't find the related informations anywhere.

mrdoob commented 11 years ago

I just started writing a md5 importer for Three.js and I am currently simply loading the first mesh defined in the .md5mesh file and add the associated informations to a THREE.Geometry instance, but how would I add multiple meshes to a single geometry?

You could return a mesh hierarchy, which is what OBJLoader currently does.

Also where would I add joints, weights and uv data to the geometry and textures?

Joints, weights and uv should go in geometry. For textures you would need to create a material and add them as map.

alteredq commented 11 years ago

but how would I add multiple meshes to a single geometry?

Another option would be to merge the triangles from all meshes into a single geometry, give them different material indices and use MeshFaceMaterial.

That's what's going on in MD5 => Blender => JSON pipeline:

http://alteredqualia.com/three/examples/webgl_animation_skinning_doom3.html http://alteredqualia.com/three/examples/models/skinned/hellknight/hellknight2.js

trevex commented 11 years ago

Thanks for the advices so far, you brought me this far :)

WIP

Still issues with importing the geometry, but probably something with my small importer. Anyway currently I organize the geometry in a mesh hierarchy, because I prefer keeping the geometry separated, that should also allow me later to swap parts of the geometry (e.g. equipping of items).

Since all the meshes share the same skeleton to which geometry would I add the joints or is it currently not possible to share the same bones, so I would have to add them to every geometry?

Update:

Although I fixed the importing of md5mesh (still haven't had a look at making the animations work, but there are still open questions related to that), the mesh has flipped faces. Even when I multiply the face.vertexNormals and face.normal by -1.

How can I flip the faces?

WIP

Unfortunately this did not help fixing the faces: https://github.com/mrdoob/three.js/issues/1119

Update:

Had to change the order of vertices in the faces...

trevex commented 11 years ago

I tried to get the textures working like this:

 var material = new THREE.MeshLambertMaterial();    
 var texture = THREE.ImageUtils.loadTexture(loader.meshes[m].shader+'.png', {}, function() {
       texture.needsUpdate = true;
       geometry.materials[0].map = texture;
 });
 geometry.materials = [ material ];

But the texture is not visible!

I had a look at this previous issue, but that didn't help (https://github.com/mrdoob/three.js/issues/1741).

Also I am not sure about the faceVertexUvs, I basically do it the same way as in the OBJLoader, but still not sure if this is the intended structure, because the fact that faceVertexUvs is a multi-dimensional Array confused me.

The hopefully right structure can be seen at the bottom of this pic: WIP

mrdoob commented 11 years ago

You should be doing this:

 var texture = THREE.ImageUtils.loadTexture(loader.meshes[m].shader+'.png');
 var material = new THREE.MeshLambertMaterial( { map: texture } );
 var mesh = new THREE.Mesh( geometry, material );
trevex commented 11 years ago

Thanks a lot the textures work fine now... I don't know how I could miss the obvious solution...