Loading geometries (vertices, faces) into threejs via input file


I have a pretty simple and standard threejs application with an init() function that sets the scene with a PerspectiveCamera, AmbientLight, OrbitControls and a WebGLRenderer.

Now I want to load geometries (vertices, faces) from an input file (using html input tag) into my threejs application. Then the loaded geometries will be assigned to a MeshPhysicalMaterial and added to the scene in the threejs app.

What would be the best practice approach for loading these geometries?

First I thought about a simple csv or json file, but then I read that glTF would be the appropriate format. I tried to prepare the geometries in python using Trimesh and exported the Trimesh scene to a glb file. But then I have already a scene, whereas I just wanted to load the pure geometries (vertices, faces)? Or do I have a misconception here?

I’m sorry for the confusion in my post, but I’m a bit stuck as you might feel.

I would really appreciate someone to give me direction here!

Thanks a lot and regards,

You can use the FileReader API for this use case. It is also used in the three.js editor for importing files. I suggest you study the Loader class for more details.

If you are only interested in pure geometry data, then glTF might not be the best choice. It always represents a scene with usually one or more 3D objects like meshes. Consider to use the Geometry JSON format if you only need the data in three.js application. Such a JSON file can be loaded and parsed with BufferGeometryLoader. Or you use a standard like PLY or even better the compressed DRACO if you need a more generic representation.

1 Like

Thanks Mugun87 for the quick reply!

Happy to read that JSON is still a decent approach for my use case! I will definitely try it out! I guess I was put off with the JSON approach when I read the JSONLoader was removed from threejs. I suppose I misunderstood the context.

I’ve just read quickly in the documentation that DRACO is more relevant for large geometries using compression. I think in my case this is not required, but I will remember this approach if it might become relevant at a later stage!

Thank you very much, this was exactly the direction I was hoping for! I will check out the FileReader and BufferGeometryLoader now!