Is there a query selector method? To find elements matching a selector like in DOM?

Questions
1

Hi, is there any kind of query selector method? Aside scene.getMeshByID, .scene.getMeshByName, etc Considering the following structure:

Scene
   House           House2           House            House2
   └ Floor1        └ Floor1         └ Floor1         └ Floor1   
    └ Window        └ Window         └ Window         └ Window
    └ Window        └ Window         └ Window         └ Window

Now If I need to change the color of all windows of House2 type. How should I do it?
Is there a way to select all Windows of House2 object?
In DOM querySelectorAll it would be “House2 Window”
In Babylon.js there is not such a thing, right?

2

Well I would use the power of js :slight_smile:

scene.meshes.filter(m => m.name === 'Window').forEach(m => m.material = newMaterial)
3

Yeah, this would work

scene.meshes.filter(m => m.name === 'Window' && m.parent.parent.name = 'House2').forEach(m => m.material = newMaterial)

would be cool to have something like

BABYLON.Selector.find('name:House2 name:Window')
BABYLON.Selector.find('anyprop:anyval anychildprop:anychildval')

I’m trying to implement something similar to help me manage the map content

4

Is having multiple meshes with the same name any problem? Can it be used multiple times? Maybe it should be different because it’s used in some internal functions? mesh.id I’m pretty sure should be unique. Otherwise i could add another prop, like “selector” instead of using the “name” prop.

I’m trying to load a scene from Blender → https://playground.babylonjs.com/#9CEG6B#2
Can you point me the way to set it up without relaying on an xhr request? So I can test

5

You could look into Load gltf from arraybuffer or json, not using blob - #2 by bghgary and Loading base64 data - #5 by JohnK to see how to load from data.

1 Like
6

I think I am gonna write a lib to add query selectors to Babylon, just for fun,

4 Likes
7

To load json scene I used:

var loader = BABYLON.SceneLoader.GetPluginForExtension('babylon');
loader.load(scene, JSON.stringify(jsonScene));
1 Like
8

Good luck, gotta be fun :cowboy_hat_face:
I’m using an easy and bugged implementation for now, but seems fine for now.
If you wanna take a look: https://www.babylonjs-playground.com/#WWUQXB#1

9

I wrote on complete library to query the scene, would you be interested in testing it / contributing ?

10

We wrote this lib and we used since many years but I’m rewriting it to be more friendly and ES6 oriented

https://babylon-runtime.github.io/api/select

…but the syntax will be the same (inspired by jQuery DOM selectors). PM me if you are interested I’m sure there’s great stuff to be done with this kind of library with BabylonJS !

2 Likes
11

I will absolutely try out the lib and maybe even contribute, but I am experiencing hard drive failure at the moment. I will try when I get my PC running smoothly