0

I'm trying to load my donut model using Three.js gltf loader, and I'm perfectly able to add the model onto the canvas, however the model doesn't load with it's geometry node data (sprinkles), as well as some mesh of the icing is either missing or z-fighting. I'm wondering if this is a problem with how the model was built, with how the model is being loaded, with how parcel is copying the model file, or even how i exported the glb file ? Model in blender
Model on canvas

Here is the code I'm using to load my model. (there is no problem getting the model onto the canvas, the donut has it's coloring however not sprinkles (geometry node data) and appears to be z fighting or missing parts of the icing mesh)

const donutUrl = new URL('../assets/big_donut.glb', import.meta.url)
const assetLoader = new GLTFLoader()
assetLoader.load(donutUrl.href, function(gltf){
    const model = gltf.scene
    model.scale.set(2,2,2)
    model.position.set(0, 1, 0)
    scene.add(model)
}, undefined, function(err){
    console.log(err)
})

Any help is appreciated, Thank you!

2
  • I would suggest trying the model in a few online glTF viewers. If it looks the same in each, then the problem has to do with how the model is being created in Blender or exported from Blender, and won't be related to the code you're using to load it. Commented Apr 14 at 19:31
  • The z-fighting could be related to your camera near/far properties, not shown in the snippet above. Try to choose the highest 'near' value and the lowest 'far' value that fit the scene, maybe around near=0.1 and far=100 here. Commented Apr 14 at 19:34

0

Browse other questions tagged or ask your own question.