hello pls i need some help , i was following some tutorials on youtube , trying to load the model but it gives me black screen , when i checked from the console of my browser it automatically tires to download a file called scen.bin.
your old.gltf depends on a file named old.bin
Which folder did you place it in?
1 Like
it’s not a good idea to use *.gltf on the web because it’s more data through the line and you need to instruct gltfloader as to where the external files are, it’s looking for them at ./ and since old.gltf is in a folder it’s not going to find old.bin there. use GLB, it packs everything up into a single file.
also in react you have this, open shell:
npx gltfjsx old.gltf --transform
this will give you a compressed glb file and a *.jsx file. drop the glb into /public and the jsx file into /src. now you can import that component and use it. it has many more advantages because that model is re-usable now and you get to alter every thing in its scene graph.
ps, components inside canvas cannot return divs. there is no such thing as a new THREE.Div() which is what you have there currently.
in its folder it came with after i downloaded from sketchfab , inside my public folder there are 3 folder that contain modelling files
Desktop_pc
oldPC
planet
in its folder it came with after i downloaded from sketchfab , inside my public folder there are 3 folder that contain modelling files
Desktop_pc
oldPC
planet
it seems that gltfloader will search in the ./public/ folder for the old.bin, instead of ./public/oldPc/
So do what @drcmda suggests, or open your gltf in blender and then export as glb so all its resources are included into the 1 file.
gltfjsx works very well if you choose to use that.
Also, its uneccesary to have Old.jsx in your ./public/oldPc/. That would be placed under ./src/ somewhere.
please would mind elaborate or explain better, as to what i should do. i do not really understand
so i should have the old.jsx inside the source folder ?? i cannot run blender my machine is not really strong
its very hard to guess the contents of your Old.jsx if you dont share it.
npx gltfjsx old.gltf --transform
this shell is used to convert the old.bin file into jsx right , cause i think i already done that
did
npx gltfjsx old.gltf --transform
create a glb version for you?
Put that into ./public/oldPc/
and update the path in your useGLTF to ./oldPc/old.glb
You also need to make sure your jsx is under the ./src somewhere, and being correctly imported and referenced into your app.
i used npx gltfjsx old.gltf to create the react version, the jsx version does it need to be inside any folder in src or just inside the src folder
i will go ahed to try this : npx gltfjsx old.gltf --transform
I Tried doing the npx gltfjsx old.gltf --transform and this is what i got , saying cannot find the file
look more closely at the error in your console message, and try to figure out what you can do yourself to correct it.
