Hello all,
I am using an express app and a page has a 3d asset viewer. I am trying to add a download glb functionality by using this documentation - glTF Exporter | Babylon.js Documentation .
The cdn provided specifically for the gltf exporter is not working and hence i used the serializer one.
Everything seems to working fine as the “glb file” is downloaded but when i try to upload the same file in babylonjs sandbox, it suggests that the file is not valid.
Can anyone lead me to a detailed documentation for the gltf exporter ?
or maybe a playground where gltf exporter is working.
thankyou for such a quick reply. The thing is i am trying to add a similar functionality in my project.
“A button to download the current 3d file in glb format”.
The download is working fine but there are times when the downloaded file is “empty” or “invalid”.
Also every file has a “root” inside the “root” which is not desirable by me.
Is there a detailed documentation for “gltf2 exporter” ?
Thankyou so much @labris , I am now able to donwload the glb files by using “shouldExportNode”.
I had to avoid loading everything else in my scene (like lights, planes, camera etc) to make the downloaded glb valid.
here’s what it looks like.
…
shouldExportNode: function (node) {
return ((node !== camera) && (node !== spotLight) && (node !== hemiLight) && (node !== dirLight) && (node !== shadowPlane) && (node !== parentBox))
}
…
yes, you can create a File object that can be used in a . In general:
Read the binary data (you probably have an arraybuffer?)
convert the array buffer to a blob (new Blob([buffer])
Use the blob to create a File object: new File([blob]))
Use the File object in your form
But just as @sebavan said - the simpler way would be to simply send a POST (or PUT) request to an endpoint accepting binary data. Or convert the data to base64 and send it as a string (and convert it back server-side). All viable options, depending on your architecture.
Now i am using the sceneSerializer as i want to save the complete scene and write that in a folder as a “.babylon” file. Everything works fine as the .babylon file is created in the right folder but when i try to import the “exported” scene in sandbox, it gives an error.
sandbox error - Unable to load from file:black_shoes.babylon: loadAssets of unknown Lights: Name: hemiLight, type: Hemispheric Name: spotLight, type: Spot Name: dirLight, type: Directional Materials: Name: groundMat
here is the code -
let serializedScene = await BABYLON.SceneSerializer.SerializeAsync(scene);
let strScene = JSON.stringify(serializedScene);
let objectUrl;
console.log(strScene);
if (objectUrl) {
window.URL.revokeObjectURL(objectUrl);
}
const blob = new Blob([strScene], { type: "octet/stream" });
// sending blob as form data
document.getElementById("sceneBlob").value = JSON.stringify(blob);
no need to change. it is a use case we simply didn’t cover yet. it will be available tomorrow in the playground, and probably next week in an npm release
// javasript code
let serializedScene = await BABYLON.SceneSerializer.SerializeAsync(scene);
let strScene = JSON.stringify(serializedScene);
let objectUrl;
console.log(strScene);
if (objectUrl) {
window.URL.revokeObjectURL(objectUrl);
}
const blob = new Blob([strScene], { type: "application/json" });
// sending blob as form data to write .babylon file
document.getElementById("glbBlob").value = JSON.stringify(blob);
// server side
const glbBlob = req.body.glbBlob
// writing file
fs.writeFile(process.cwd() + "./myfilepath", glbBlob, (error) => {
if (error) {
console.error('an error occurred : ', error);
} else {
console.log('file created!');
}
})
The scene.babylon file that i’m writing in the folder is not a valid file because the size is too small compared to the file being downloaded.
Now, Am i doing something wrong while writing the file because the downloaded file is working but when i try to write the same file it is an invalid file.
.
!!
