erichlof/THREE.js-PathTracing-Renderer

GLTF_Model_Viewer didn't get the right result?

sonygod opened this issue · 7 comments

GLTF_Model_Viewer didn't get the right result?

the origin gltf is

image

after import into gltf viewer?

image

and I add some code here?

image

is this code wrong or somthing else?

model is here.

rjh_test_1672042778000.zip

Hello @sonygod
Thank you for providing screenshots and the original model file - that helps a lot. I will try to get your model loaded on my machine, maybe with some slightly different glTF loading code. Of all the demos on this repository, this glTF demo that you are trying to use is the only one I did not write myself. I merely maintain it with updates when three.js updates their library with breaking changes sometimes.

The glTF loading and material assigning is honestly the weakest part of my repo here and the weakest area of my graphics knowledge. I am comfortable with the ray tracing and path tracing elements of the code base, but not so much with the glTF model loading and correct glTF material (especially many different textures in the glTF file) rendering parts.

But regardless, I'll take a look and do my best to help you out, or at least point you in the right direction.

Will be back hopefully soon 🙂
-Erich

@sonygod
Hello, I'm back with some initial findings. It seems there are some attribute differences between the components of the model you provided. I can't even get it to load with the three.js library and their glTF loader and BufferGeometryUtils.js. Here is a screenshot of my console:

gltfOutput

Apparently, either the glTF model must have indices for all sections (components) of the model, or no indices at all. When I disabled this error check in the BufferGeometryUtils.js file, it loads the model, but it looks wrong - also, it gives a number of triangles that has a fractional component, like 4337.3333 - which should never happen. If everything loads correctly, the number of triangles is the number of vertex positions (x,y,z) divided by 9. This is because every triangle has 3 vertices, and every vertex has 3 components - x, y, and z. So that's 3 x 3 = 9 float numbers for each triangle. If the model's geometry.attributes.position.array.length is not divisible by 9, something is wrong at load time.

How was this model created? What software was used? Can you verify that each triangle has 3 vertices?

Hello,
Ok thanks for the additional information. I was able to successfully load your model inside the online glTF viewer:
https://gltf-viewer.donmccurdy.com/
Everything was displaying correctly, so my apologies - I was incorrect to assume that something was wrong with your model file. If I had to guess what the problem is, I think it has to do with multiple matrices, as in parent and child matrices, that affect the final position of all the triangles (or groups of triangles for the different components of the apartment building), when they are displayed correctly. Reviewing the code for the glTF viewer (again, that I did not write) here on my repo that you were trying to use, it appears that the author tried to account for parent and child matrices in the scene 'traverse' function. But still, I can't get your model to show up correctly using that author's loading code/demo. The triangles show up, but seem to be not positioned correctly, or not indexed correctly.

With the glTF model demos that I did write personally, I am able to load the classic Utah Teapot, Stanford Bunny, Stanford Dragon, and Damaged Helmet models, all in glTF or glb format. I think all these work because the original model file has 1 texture (or none) for the entire model, and more importantly, all the vertices in the original file are positioned exactly from the same origin. In other words, there are no groups of objects with their own model-space origins, there is only one model origin at the center of the entire model, and every triangle is listed in the file in relation to that same origin. Therefore, no extra work needs to be done on my part, because I just simply load in the exact triangle vertex positions, create the BVH acceleration structure, and then send everything to the GPU as a data texture where it can be ray traced against or rendered.

If there are any extra components, or a modular model structure (that makes sense for an apartment building), I'm sorry to say that at this time, I do not know how to correctly load in such a glTF file, because of the groups, or parent and child matrices, that might affect the pure triangle vertex positions that are listed in the glTF file. My simple loading code is incorrectly just reading in all the vertices as they are listed in the raw glTF file, and trying to display them without first applying the possible matrix stacks to those raw vertices. As I mentioned in my first reply, glTF loading and multiple texture loading is the weak-point of my path tracing repo here. I do eventually want to be able to correctly load any arbitrary glTF file in the future, but it will take much more study and effort on my part to know how to handle such files.

I hope I have explained the situation well enough. Again, apologies for not being able to help further. I would if I could, but this loading stuff is not my strongest area - far from it actually. I hope you are able to find a solution. Maybe somehow, combining/merging all the vertices into the same single model object inside your 3d model creation software? The textures still might not work, but at least the triangles would be displayed in their correct order and positions.

-Erich

@erichlof Hi, I think I have same issue, I want try renderer with my own model, but it not loading anything, error on acces child.geometry.index.cout. I don't know much about shader programming. But I using some code to recompute verticies position to world position (where are really rendered).

When you world matrix of Object3D (mesh in this case) to vertex you will get him position in world space. So maybe you can apply this in shader, or we can write some algorithm, which will recompute positions of verticies and make every transform matrix indentity (no rotation/translation).

You can send Matrix4 to shader or you can decompose this matrix, to translation, rotation and scale and send only these vectors.

The code:

 const vertex = new Vector3();
 const pos = obj.geometry.attributes.position;
 vertex.set(pos.array[0], pos.array[1], pos.array[2]);
 const vertexWorldCoord = vertex.applyMatrix4(obj.matrixWorld);
kfarr commented

I also face this same issue trying to import gltf files with multiple materials and meshes.

For ensuring vertices are all centered around same origin, would a tool like this help? Maybe flatten and then clearnodetransform?
https://gltf-transform.donmccurdy.com/functions.html#clearnodetransform

@kfarr
Thank you for the link. That may help in this situation, but Don's library is operating with glTF directly, whereas I would like to use the Three.js built-in glTF loader, and then extract the data from that resulting Three.js Mesh(es) representation.

I have been successful with a single model with 1 overarching material that covers the entire mesh, but I'm still working on extracting an arbritrary number of meshes that might make up a glTF scene. Whatever is used in the end, it must respect all of the relationships between parent and child matrices, which is tricky for me to understand - but I am studying it and trying to improve. 😅