Object3D.userData Three.JS equivelent in BabylonJS

I’ve looked around to see if there was this functionality and the only thing I found somewhat related to this issue is this thread from 2014. From what I can see, tags were implemented because of the conversation, however the main thing OP asked for was not elaborated on. Tags are useful, but in my use case, not useful enough. I would need a direct equivalent of three.js Object3D.userData.Was the serializable userData object ever implemented and I am just missing it or was it never realized?

1 Like

If you are using javascript you can just set it as you wish :slight_smile: If you use typescript, you can always use metadata:



Thanks, I guess I needed to more thoroughly read the documentation :smiley:. I guess the issue was lack of it standing out.

I know that if you use metadata anything you add via this will be serializable as metadata is. If you use Javascript and just set a new property rather than going through metadata, is this serializable? eg

mesh.metadata = {};
mesh.metadata.heightReached = 100;

will serialize


mesh.heightReached = 100;

serialize? I thought not.

No, it won’t.

The documentation of the userData is:

An object that can be used to store custom data about the Object3D. It should not hold references to functions as these will not be cloned.

So - it is just a placeholder, just like any other object.

1 Like

sorry for opening this subject
but I didn’t fully understand the solution
like OP, I have an userData json on the main gltf object
and I do not see how to access it
there are some custom textures that need to be overwritten

const plugin = SceneLoader.Append(rootUrl, sceneFileName, this.scene, function (scene) { });
(plugin! as GLTFFileLoader).onParsedObservable.add(gltfBabylon => {

if anyone has a better solution , please share :slight_smile: , thank you
PS: how can I do this with AppendAsync ? thank you

cc @bghgary

If you mean the extras property in glTF, we currently only read this property for node, camera, and material which are written to the metadata.gltf.extras of the corresponding Babylon.js object.

Feel free to contribute more to the glTF loader extension if you want to support more object types.

This solution works more generically but you will have to do the mapping between the glTF JSON and Babylon manually.

thank you for your answer,
I am relative new to this but I will contribute as I can

I will map the objects manually , is there other options ? the textures that are in extra have a better quality than the glb so I have to overwrite them

thank you and have a nice day

@Zyku If you can send an example of what glTF object’s extras property you need, that will help.

I have a list of teaxtures base64
after loading the object into scene
I go over each material and overwrite the maps ( opacityTexture / bumpTexture / diffuseTexture )
I do this because thay have a better quality than the exported glb


textures: Array(31)
anchor: {x: 0, y: 0}
guid: "bb581b5d-40ea-450e-8a54-0ebead65a45b"
isTiled: false
name: "Sleeve_Right"
order: 32
originalAnchor: {x: 0.5448543429374695, y: 0.4297634959220886}
position: {x: 0, y: 0}
resourceType: "IMG"
resourceUri: "data:image/png;base64,iVBORw0K....
rotation: 0
size: {x: 284, y: 361}

Are the extras on the material then? If so, then the current extrasAsMetadata glTF loader extension should already give you what you need?

my metadata looks like this

pointers: (2) [’/meshes/22/primitives/0’, ‘/nodes/24’]

I will talk to the team that is generating the glb file

Which Babylon object is that for? If you can send me a repro, I can investigate more.

May I ask if you have exported the glb file with json.extras on babylon gltf2Export?