# Selected meshes

**URL:** <https://forum.babylonjs.com/t/selected-meshes/12442>\
**Category:** Questions\
**Tags:** material\
**Created:** [July 13, 2020, 11:56am UTC](https://forum.babylonjs.com/t/selected-meshes/12442 "2020-07-13T11:56:26Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 11:56am UTC](https://forum.babylonjs.com/t/selected-meshes/12442/1 "2020-07-13T11:56:26Z")

</div>

Hello Everyone

I have 4000 cubes on the scene and I want to select some of them interactively.  
I create a box with Gizmo that can be modify in terms of locating and scaling. I want to select all the meshes that are inside the box and then deleted rest of the cubes outside the box . how can i do this, please help me to solve it.

---

<div class="post-metadata">

**Author:** ![JohnK](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/johnk/32/26764_2.png) [@JohnK](https://forum.babylonjs.com/u/JohnK)\
**Post date:** [July 13, 2020, 1:21pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/2 "2020-07-13T13:21:10Z")

</div>

You will know the dimensions of the box with Gizmo (box G) then place the cubes into two arrays one for in the box G one for outside box G. A cube will be inside box G when for each axis

min of box G \< min of cube and max of cube \< max of box G

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 1:31pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/3 "2020-07-13T13:31:40Z")

</div>

Thank you for helping, but i did not understand what should i do exactly, could you please explain it with more detail?

---

<div class="post-metadata">

**Author:** ![JohnK](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/johnk/32/26764_2.png) [@JohnK](https://forum.babylonjs.com/u/JohnK)\
**Post date:** [July 13, 2020, 1:40pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/4 "2020-07-13T13:40:38Z")

</div>

It would be easier if you created a playground with 5 or 6 cubes and a box with Gizmo that you would use to select some cubes.

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 1:43pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/5 "2020-07-13T13:43:31Z")

</div>

thank you so much.

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 3:19pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/6 "2020-07-13T15:19:06Z")

</div>

i have another question, should i use box G dimension or position? is it possible to show it to me for 5 cubes and one box G?

---

<div class="post-metadata">

**Author:** ![JohnK](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/johnk/32/26764_2.png) [@JohnK](https://forum.babylonjs.com/u/JohnK)\
**Post date:** [July 13, 2020, 3:22pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/7 "2020-07-13T15:22:40Z")

</div>

> [@Arash\_Bagheri](#):
>
> i have another question, should i use box G dimension or position?

You need both

```auto

```

> [@Arash\_Bagheri](#):
>
> is it possible to show it to me for 5 cubes and one box G?

Yes when you have made a playground with 5 cubes and one box G

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 4:21pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/9 "2020-07-13T16:21:10Z")

</div>

> [@JohnK](#):
>
> Yes when you have made a playground with 5 cubes and one box G

thank you so much,

> **[Babylon.js Playground](https://playground.babylonjs.com/#K05LU3%236)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

---

<div class="post-metadata">

**Author:** ![JohnK](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/johnk/32/26764_2.png) [@JohnK](https://forum.babylonjs.com/u/JohnK)\
**Post date:** [July 13, 2020, 4:27pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/10 "2020-07-13T16:27:27Z")

</div>

Taking into account the scaling of box G then a cube will be inside boxG ‘inside = true’

```javascript
boxG.computeWorldMatrix(true); //force any transformations
let inX = boxG.getBoundingInfo().boundingBox.minimumWorld.x < box.getBoundingInfo().boundingBox.minimumWorld.x && box.getBoundingInfo().boundingBox.maximumWorld.x < boxG.getBoundingInfo().boundingBox.maximumWorld

//repeat for y and z and then

let inside = inX && inY && inZ

```

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 4:32pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/11 "2020-07-13T16:32:10Z")

</div>

thank you so much

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 4:43pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/12 "2020-07-13T16:43:15Z")

</div>

sorry for my question, in the above code boxG is refer to my arrays of cube?

---

<div class="post-metadata">

**Author:** ![JohnK](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/johnk/32/26764_2.png) [@JohnK](https://forum.babylonjs.com/u/JohnK)\
**Post date:** [July 13, 2020, 4:45pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/13 "2020-07-13T16:45:49Z")

</div>

> [@JohnK](#):
>
> box with Gizmo (box G)

other box better as cube

```auto
boxG.computeWorldMatrix(true); //force any transformations
let inX = boxG.getBoundingInfo().boundingBox.minimumWorld.x < cube.getBoundingInfo().boundingBox.minimumWorld.x && cube.getBoundingInfo().boundingBox.maximumWorld.x < boxG.getBoundingInfo().boundingBox.maximumWorld

//repeat for y and z and then

let inside = inX && inY && inZ

```

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 4:54pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/14 "2020-07-13T16:54:06Z")

</div>

sorry again.

i do it in this form, is it right?

var cube1 = BABYLON.MeshBuilder.CreateBox(“box”, { size: 1 }, scene);  
cube1.position.x = 2;  
var cube2 = BABYLON.MeshBuilder.CreateBox(“bo2”, { size: 1 }, scene);  
cube2.position.x = 4;  
var cube3 = BABYLON.MeshBuilder.CreateBox(“box3”, { size: 1 }, scene);  
cube3.position.x = 6;  
var cube4 = BABYLON.MeshBuilder.CreateBox(“box4”, { size: 1 }, scene);  
cube4.position.x = -2;

var cube5 = BABYLON.MeshBuilder.CreateBox(“box5”, { size: 1 }, scene);  
cube5.position.x = -4;

var mat = new BABYLON.StandardMaterial(“mat”, scene);  
mat.diffuseColor = new BABYLON.Color3(0, 0, 1);  
cube3.material = mat;  
var boxG = BABYLON.MeshBuilder.CreateBox(  
“box”,  
{ height: 1, width: 1, depth: 1 },  
scene  
);  
boxG.position.y = 2;

const mat2 = new BABYLON.StandardMaterial(“mat2”, scene);  
mat2.diffuseColor = new BABYLON.Color3(1, 0, 0);  
boxGmaterial = mat2;

// initialize GizmoManager  
var gizmoManager = new BABYLON.GizmoManager(scene);  
gizmoManager.boundingBoxGizmoEnable = true;  
// gizmoManager.attachableMesh = box;  
gizmoManager.positionGizmoEnabled = true;  
gizmoManager.boundingBoxGizmoEnabled = true;  
gizmoManager.usePointerToAttachGizmos = false;  
gizmoManager.attachToMesh(boxG);  
boxG.visibility = 0.3;

boxG.computeWorldMatrix(true); //force any transformations  
let inX =  
boxG.getBoundingInfo().boundingBox.minimumWorld.x \<  
boxG.getBoundingInfo().boundingBox.minimumWorld.x \<  
cube1.getBoundingInfo().boundingBox.minimumWorld.x &&  
cube1.getBoundingInfo().boundingBox.maximumWorld.x \<  
boxG.getBoundingInfo().boundingBox.maximumWorld;

let inY =  
boxG.getBoundingInfo().boundingBox.minimumWorld.y \<  
cube1.getBoundingInfo().boundingBox.minimumWorld.y &&  
cube1.getBoundingInfo().boundingBox.maximumWorld.y \<  
boxG.getBoundingInfo().boundingBox.maximumWorld;

let inZ =  
boxG.getBoundingInfo().boundingBox.minimumWorld.z \<  
cube1.getBoundingInfo().boundingBox.minimumWorld.z &&  
cube1.getBoundingInfo().boundingBox.maximumWorld.z \<  
boxG.getBoundingInfo().boundingBox.maximumWorld;

let inside = inX && inY && inZ;

---

<div class="post-metadata">

**Author:** ![JohnK](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/johnk/32/26764_2.png) [@JohnK](https://forum.babylonjs.com/u/JohnK)\
**Post date:** [July 13, 2020, 4:58pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/15 "2020-07-13T16:58:17Z")

</div>

Looks OK. You need to try it in a PG and see if you get any error messages.

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 5:39pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/16 "2020-07-13T17:39:52Z")

</div>

sorry one more question , for my project i should put these codes in a loop?

---

<div class="post-metadata">

**Author:** ![JohnK](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/johnk/32/26764_2.png) [@JohnK](https://forum.babylonjs.com/u/JohnK)\
**Post date:** [July 13, 2020, 5:41pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/17 "2020-07-13T17:41:50Z")

</div>

IMHO you should only call it when needed, ie when boxG is in the position you want it to be. So use some sort of event to trigger, for example from a GUI button.

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 13, 2020, 5:43pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/18 "2020-07-13T17:43:32Z")

</div>

tnx a lot

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 14, 2020, 11:32am UTC](https://forum.babylonjs.com/t/selected-meshes/12442/19 "2020-07-14T11:32:39Z")

</div>

sorry for taking your precious time again, i did it, and then i face to another problem,  
when I want to delete cubes out of boxG , it is not very accurate.

 ![Screen Shot 1399-04-24 at 15.52.40](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/9/9fb05c5d721aef3fb5e2ab158b723784241edfd3.png)

 ![Screen Shot 1399-04-24 at 15.53.12](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/b/b7bd86ba40b8ba5774a75b8242ac1703b7f864fb.png)

what should i do to get exact cubes inside the boxG.

---

<div class="post-metadata">

**Author:** ![JohnK](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/johnk/32/26764_2.png) [@JohnK](https://forum.babylonjs.com/u/JohnK)\
**Post date:** [July 14, 2020, 1:06pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/20 "2020-07-14T13:06:58Z")

</div>

Possibly you could rotate boxG to match the orientation? You might have to consider maximum and minimums along local axes rather than just from the boundingBox. It is getting rather complicated. It is difficult to advise without knowing more detail about your usage.

---

<div class="post-metadata">

**Author:** ![Arash\_Bagheri](https://avatars.discourse-cdn.com/v4/letter/a/dfb087/32.png) [@Arash\_Bagheri](https://forum.babylonjs.com/u/Arash_Bagheri)\
**Post date:** [July 14, 2020, 1:56pm UTC](https://forum.babylonjs.com/t/selected-meshes/12442/22 "2020-07-14T13:56:52Z")

</div>

the problem is when i drag boxG on screen , then it start to rotate when goes to the edge of screen, is it possible to fix it ?

[Next page](https://forum.babylonjs.com/t/selected-meshes/12442.md?page=2)