Making a 3js model importer

[GameMonetize]

Unfortunately I'm not sure to understand your problem. Your sample is full of other code not related to the problem.

One last thing that can help you: The code used by CreateBox where you can define specific uvs per face:

https://github.com/BabylonJS/Babylon.js/blob/master/src/Mesh/babylon.mesh.vertexData.ts#L619

[GameMonetize]

If you want to have different texture coordinates on a box you will need:

-6 * 4 uv pairs: 4 pairs per face and 6 faces = 24 pairs

- 6 * 6 indices: 6 indices per face (2 triangles) and 6 faces = 36 indices

So you need 24 positions/normals, 24 uvs and 36 indices

[chicagobob123]

Thinking about it yesterday this is becoming an impossible task. I do not think the two formats will every become compatible. 

IMO the Babylon format not using indices for UV's makes the model much larger in size. 
>> I tired  24 positions/normals, 24 uvs and 36 indices this morning<<

I think all the positions have to be pointed to by at least one index. Otherwise the UV's definitions are ignored. 

Going to prove that to myself in a bit. 

Ran the experiment here and if you have a UV that aligns with a square but the Indices do not use those vertices the UV's are not used. 

So having  24 positions/normals, 24 uvs and 36 indices is not enough. The 36 indices have to point to use all 24 positions for the UV's to have any effect. 

Well after that brain teaser I think I will stop trying to meld these to formats together. They are incompatible. 3JS depends entirely on indices using the fewest vertices possible while Babylon depends on vertices to make faces. The UV mapping is also based on 2 triangles making a square it seems. 

 Ouch. So even thought I can import the mesh just fine mapping back the UV's means adding points normals and seems almost impossible. 

 

Edited May 31, 2016 by chicagobob123
add additional information.

[GameMonetize]

Quote

 The 36 indices have to point to use all 24 positions for the UV's to have any effect. 

Sorry but I don't get where this is different from what I said?

Quote

So having  24 positions/normals, 24 uvs and 36 indices is not enough

No it is enough...You indices can point to a vertex more than once. (every face is composed of 4 positions/normal/uvs and 2 vertices are pointed twice):

here is an example of a complete face:

positions: [0, 0, 0,

                0, 1, 0,

                1, 1, 0,

                1, 0, 0]

uvs:         [0, 0,

                0, 1,

                1, 1,

                1, 0]

indices: [0, 1, 2,

              0,  2, 3]

 

 

 

[chicagobob123]

What I meant by "not enough" is, you HAVE make sure the indices USE ( point to ) the new Vertices

for the UV's to be used. Its not enough that the vertices exist. 

In other words with 8 vertices can create all the faces for a box using indices. The indices point to the proper points and make a box with all its faces. 

To have UV's work you have to ADD an additional 16 Vertices and the indices have to be altered to POINT to the 16 NEW vertices or the UV's will not work. 

This makes the format incompatible with a index based format such as 3js.

 

[jerome]

In BJS :

3 successive floats in the positions array represent a vertex (x, y, z coordinates)

3 successive integer in the indices array represent a triangular facet built from 3 vertex of the positions array : each integer is the index of the related vertex in the positions array

 

In 3JS, if I remember well :

only a positions array is used. If some vertices are to be re-used, then their positions are duplicated in the positions array.

This means : each triplet of successive floats in the positions array are a vertex (like in BJS) and then each pack of 9 floats (3 successive vertices) depict a facet. There's no concept of vertex re-use, every position is duplicated as many times it is needed.

So unless you compare the position values between them, you can't deduct that a vertex is re-used in the BJS way.

Nevertheless, BJS can deal with vertices not declared as reused (who can do more, can do less) : just populate your BJS indices array with the index of each vertex you find in the 3js positions array when iterating it. This would probably lead to something really simple like : indices = [0, 1, 2, 3, 4, ... ]  as 3 successive vertices are one facet in the 3js positions array, if I remember right.

 

 

[chicagobob123]

10 hours ago, jerome said:

In BJS :

3 successive floats in the positions array represent a vertex (x, y, z coordinates)

3 successive integer in the indices array represent a triangular facet built from 3 vertex of the positions array : each integer is the index of the related vertex in the positions array

I agree completely. I may not be able to convey that information clearly in my posts but I really that part.

10 hours ago, jerome said:

In 3JS, if I remember well :

only a positions array is used. If some vertices are to be re-used, then their positions are duplicated in the positions array.

This is not true. They reuse the positions in their file format (internally I have no idea how they unwind this).

They are not duplicated. 8 vertices defines a cube with 12 triangles. In the file they define pair the UV's as an array

which is then attached to the each indexed vertex. In the three js file format there is a

 

vertex array []  -  V1,V2,V3,V4,V5,V6,V7,V8  for a cube 

Normal [] list 

 UV[] list 

Faces [] - These are actually a record per triangle.

Each record contains the type and the data associated with the type. 

There are several different types but I have only worked on Record 42. 

Record 42 consists of 4 parts 

1) indexes to 3 vertices 

2) Index to the Material 

3) UV pair index per vertice

4) Normal index per vertice

 

On the Babylon side

Getting this into a Babylon MESH has become an impossible task. 

1) the face vertices are not in the same order. 

2) the UV's are attached to the vertices of a triangle not a square. 

3) the normals are also tied to the vertices. 

This is so desperate from the Babylon format that I can't glue it together and make work. 

In Babylon what has worked

4 UV pair goes to

4 vertexes which

make 2 triangles out of 6 indexes. 

Every vertex MUST be mapped to an index otherwise the UV will not be applied.

Maybe I am wrong but this is what I have found by trial and error.

Yesterday I was able to make it work by manipulating the input data by hand until it actually worked.

 

 

 

[chicagobob123]

When the guys exported from 3D Studio and I could not load it I thought I was cooked. But after all the stuff I learned from working on particles I was able to push the importer almost to completion. 

The importer is ALMOST done. The UV mapping is reversed somehow. But I will figure that out I hope this weekend. 

Anyway.. What I thought was a complete bust I reworked and think I am close to completion. This will solve a bunch of problems dealing with the 3D guys for me.

[GameMonetize]

This is cool!!!! Do you think it is generic enough to become an official 3js importer?

[chicagobob123]

I am working on that. 

I am decoding the three js models that came from 3D Studio. 

Will have to test with Blender Export. I have a few of those models around.

Worked with MULTIPLE UV mapped textures. 

[chicagobob123]

It seems to be working OK so far except from the UV mapping is backwards? 

Trying to figure that out its cool to see it when it works

. 

[GameMonetize]

yes it is

did you try to load texture with invertY = false ?http://doc.babylonjs.com/classes/2.4/Texture#new-texture-classes-2-4-texture-url-scene-nomipmap-inverty-samplingmode-onload-onerror-buffer-deletebuffer-

[chicagobob123]

http://www.babylonjs-playground.com/#UDUFX#94

Here is the latest effort. It works for multiple UV maps. Not sure what else will or wont work. 

The only think that I can't figure out is how to get the alpha maps per UV working. 

Three js has the image come in 2 pieces. UV and an Alpha. Any ideas on that one? 
 

[chicagobob123]

I gave up on using the seperate alpha channel and just combined the diffuse UV map with alpha.

This worked out great! Notice the grate at the top is see through. Its the details.   The renderer does a very nice job. 

• 
  Max total size 4.88MB
   
• Insert other media 

Uploaded Images

•  
•  

[GameMonetize]

This is really cool!