CODEWITHSUNDEEP
javascriptreactjsthree.jsreact-three-fibergltf
Ziad Kaddari
Ziad Kaddari

Reputation: 3

How can i convert a big gltf file to jsx?

i have a 3d scene in blender and wanted to use it in my react three fiber project but after exporting to gltf i found a 300k line in the file. the file works fine in normal threejs but when i execute the command npx gltfjsx public/models/map.gltf It stays stuck for a while. Is my gltf file too big for gltfjsx ?

the jsx file is created but still empty

Upvotes: 0

Views: 1379

Answers (3)

Maruf
Maruf

Reputation: 1

use npx gltfjsx public/model.glb -o src/components/ComponentName.jsx -r public

Upvotes: 0

Yilmaz
Yilmaz

Reputation: 49661

use gltfjsx npm module:

npx gltfjsx model.gltf --transform

This will create a Model.jsx file that plots out all of the assets contents.

Upvotes: 0

emackey
emackey

Reputation: 12448

In Blender, try exporting it as "glTF Binary" (producing a *.glb file), or use "glTF Separate" (which will produce a collection of files that must be shared as a group).

Don't use the "glTF Embedded" option in Blender. It will produce a JSON-formatted *.gltf file that contains base64-encoded textures and mesh data, resulting in lines over 300k long as you discovered. This is an archaic option that is under consideration for removal from Blender.

Upvotes: 1

Related Questions