Is there a way to pack multiple glb's to one

Questions
, , ,
1

I am trying to store to convert multiple glb’s to one .I tried to go with this functions.(I am using react)
const response = await GLTF2Export.GLBAsync(scene, “Test”, options);

But with the it is downloading multiple files of glb’s which store the data of the scene.Like the file shown in the picture.
image
In this it is downloading 3 files of glb’s .
But I want to convert those multiple glb’s files into one glb file.

And also want to store the texture files data into that glb .Whose data is stored in these files.
image
The files with ktx2 exxtensions.

2

Would be great to see a repro in the playground but please be aware there are still quite a few unsupported features to our exporter.

3

KTX textures are currently not handled by the GLB exporter. Vote for this feature! - Add Support KTX Textures in GLB Exporter

To export GLB with KTX textures you may use GLTF-Transform
Here is the example - https://glb.babylonpress.org/

I think you call the exporter several times. There should be only one GLB file after one scene export.

4

thanks for the quick response actually the scene consist of multiple model glb files(As shown in picture one)
…And is there a way to pack all the textures files and glb models into one glb file…

5

I believe you need to use GLTF-Transform here.
Pass your data there when export:

            const exportScene = await GLTF2Export.GLBAsync(this._scene, "fileName", options);
            const blob = exportScene.glTFFiles["fileName" + ".glb"];
            const arr = new Uint8Array(await blob.arrayBuffer());
            const io = new WebIO().registerExtensions(ALL_EXTENSIONS);
            const doc = await io.readBinary(arr);

To merge GLBs use mergeDocuments | glTF Transform

6

async function exportToGLB(scene) {
console.log(“glbExport”, scene);
scene.meshes.forEach((mesh) => {
mesh.name = mesh.id;
});
var options = {
shouldExportNode: function (node) {
return (
node.isEnabled() &&
node !== scene.activeCamera &&
node !== scene.lights[0]
);
},
includeCoordinateSystemConversionNodes: false,
};

try {
    // const response = await GLTF2Export.GLBAsync(scene, "Test", options);

    // console.log("Export successful:", response);

    // response.downloadFiles();
    const exportScene = await GLTF2Export.GLBAsync(
        scene,
        "fileName",
        options
    );
    const blob = exportScene.glTFFiles["fileName" + ".glb"];
    const arr = new Uint8Array(await blob.arrayBuffer());
    const io = new WebIO().registerExtensions(ALL_EXTENSIONS);
    const doc = await io.readBinary(arr);
    console.log("dpcss", doc);
} catch (error) {
    console.error("Error exporting GLB:", error);
}

}

i have used the code in my function but at the time merging the thing is that the files are not creating same time but one by one
Like in my scene two model.glb is presenting
image
then the “doc” is consoling one by one
image
How can I merge these files?

7

After you have the Document(s) - Document | glTF Transform - you may use it with GLTF-Transform functions.
Merge example - mergeDocuments | glTF Transform
Then export the resulting document

 const glb = await io.writeBinary(doc);
1 Like
8

ok will try…

9

Here is the full code to make GLB downloadable:

        const glb = await io.writeBinary(doc);
		const assetBlob = new Blob([glb]);
        const assetUrl = URL.createObjectURL(assetBlob);
		const link = document.createElement("a");
        link.href = assetUrl;
        link.download = "SomeFileName"+".glb";
        link.click();
10

yes it will work but I am trying to club the multiple files because the function is calling number of times because there are multiple scenes loading(in model.glb files) to form an object and am not able to store the data of files …