I am currently working on a project where I need to upload and display 3D models from OBJ files on a web page. I am using Three.js for rendering the 3D content. The specific requirement is to have a toggle button that can show/hide the quad meshes of the uploaded OBJ model.
Upon inspecting my OBJ files, I noticed that they consist of quad meshes, with face definitions like:
f 4622/18168/4622 8992/18234/8992 24049/24408/24049 12025/24407/12025
These face definitions indicate that the model is made up of quad meshes. However, when I render the model using Three.js, it automatically converts everything to triangular meshes. I am aware that this is the default behavior of Three.js and WebGL since they primarily work with triangles.
My question is: Is there any workaround or method that I can employ to display the original quad meshes using Three.js? I would like the toggle button on my webpage to be able to switch between displaying the quad and triangular meshes.
I have already implemented the file upload functionality and can render the model, but I am stuck on how to show the quad meshes instead of the triangulated ones.
Any suggestions or guidance would be highly appreciated!
