visgl / deck.gl

WebGL2 powered visualization framework
https://deck.gl
MIT License
12.1k stars 2.08k forks source link

Loading materials for use in SimpleMeshLayer #4023

Closed vincentmvdm closed 4 years ago

vincentmvdm commented 4 years ago

I'm trying to display my 3D model using SimpleMeshLayer. I'm exporting the file to .obj from Cinema 4D, after which I get both an .obj file and a .mtl file. I can load the .obj file using OBJLoader, but can't figure out how to load the material file too.

This is the example I'm looking at: https://github.com/uber/deck.gl/tree/7.0-release/examples/website/mesh SimpleMeshLayer: https://github.com/uber/deck.gl/blob/master/docs/layers/simple-mesh-layer.md

Thanks!

Pessimistress commented 4 years ago

Are you using the texture prop?

vincentmvdm commented 4 years ago

Are you using the texture prop?

I'm not! I figured I don't need a texture if I can successfully load my Cinema 4D materials (but I could be wrong)!

ibgreen commented 4 years ago

I can load the .obj file using OBJLoader, but can't figure out how to load the material file too.

Unfortunately, loaders.gl currently does not have an MTLLoader (i.e. it only supports the OBJ part of OBJ/MTL). You'd have to load the texture manually, or use glTF and the ScenegraphLayer.

The MTL format is very simple so it would not be hard to add support to loaders.gl. We could always open an issue there...

vincentmvdm commented 4 years ago

I can load the .obj file using OBJLoader, but can't figure out how to load the material file too.

Unfortunately, loaders.gl currently does not have an MTLLoader (i.e. it only supports the OBJ part of OBJ/MTL). You'd have to load the texture manually, or use glTF and the ScenegraphLayer.

The MTL format is very simple so it would not be hard to add support to loaders.gl. We could always open an issue there...

Thanks for the quick and insightful reply Ib! That clears up a lot! (Looking back I should've read this blog post better: https://medium.com/vis-gl/introducing-deck-gl-v7-0-c18bcb717457). I'll try to use glTF and report back!

jonathanperezg commented 2 years ago

I can load the .obj file using OBJLoader, but can't figure out how to load the material file too.

Unfortunately, loaders.gl currently does not have an MTLLoader (i.e. it only supports the OBJ part of OBJ/MTL). You'd have to load the texture manually, or use glTF and the ScenegraphLayer.

The MTL format is very simple so it would not be hard to add support to loaders.gl. We could always open an issue there...

Hello, I am also loading a .obj file and can't seem to use its corresponding .mtl file. I load the .mtl file using the MTLLoader from Three.js (which returns an instance of MTLLoaderMaterialCreator), but I can't figure out how to use it with the SimpleMeshLayer.

Would it be considered a texture? When reading the documentation for the SimpleMeshLayer I see that the "texture" property can take any of the following:

(String|Texture2D|Image|ImageData|HTMLCanvasElement|HTMLVideoElement|ImageBitmap|Promise|Object, optional)

However, I wouldn't know how to use the MTLLoaderMaterialCreator instance with the SimpleMeshLayer.

Any help would be great. Thanks :)

ibgreen commented 2 years ago

@jonathanperezg does the loaded material contain a URL to a texture? Then perhaps you could use that.

jonathanperezg commented 2 years ago

@jonathanperezg does the loaded material contain a URL to a texture? Then perhaps you could use that.

I figured using the ScenegraphLayer is the best route to take since glTF has more support. Is it possible to load a .glb file from a local directory? When reading the documentation I see that we must pass in one of the following to the "scenegraph" property:

" scenegraph (URL|Object|Promise) "

Can the URL be a path to a local .glb file?

ibgreen commented 2 years ago

No, web browsers cannot access local files (unless the user selects them in a file selection dialog or a file drop).

Alternatively you can use a local http server.

ibgreen commented 2 years ago

You could bundle the file if it is not too big. You could also make it into a data URL...

jonathanperezg commented 2 years ago

No, web browsers cannot access local files (unless the user selects them in a file selection dialog or a file drop).

Alternatively you can use a local http server.

Yes I'm currently using the localhost and was loading the .obj files with OBJLoader (loaders.gl/obj) from my local filesystem and adding them to the "mesh" property of the SimpleMeshLayer successfully. However I seem to be having a bit of trouble with loading the .glb files. I'll make the file into a data URL and report back. Thank you for all the help!