When exporting my scene, I follow a simple method:
function save(blob, filename) {
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
link.download = filename;
link.click();
URL.revokeObjectURL(link);
}
function saveString(text, filename) {
save(new Blob([text], { type: "text/plain" }), filename);
}
function saveArrayBuffer(buffer, filename) {
save(new Blob([buffer], { type: "application/octet-stream" }), filename);
}
const exporter = new GLTFExporter();
exporter.parse(
scene,
function (result) {
const name = `${modelName}.glb`;
if (result instanceof ArrayBuffer) {
saveArrayBuffer(result, name);
} else {
const output = JSON.stringify(result, null, 2);
saveString(output, name);
}
},
function (error) {
console.log(error);
},
{
binary: true,
animations: [mixer.clipAction(model.animations[0]).getClip()],
}
);
The issue lies in the hierarchy of my exported scene. Normally, objects are directly under the scene, but during export, they end up nested within a new empty object. I want to maintain the original structure of my scene.
Before Export:
https://i.sstatic.net/peqVd.png
After Export:
https://i.sstatic.net/Qqtl5.png
Note: My scene includes animations tied to objects.