# BoundingBox Does Not Affect Occlusion Culling for the Model

**URL:** <https://discourse.threejs.org/t/boundingbox-does-not-affect-occlusion-culling-for-the-model/54050>\
**Category:** Questions\
**Tags:** bounding-box\
**Created:** [July 18, 2023, 11:20am UTC](https://discourse.threejs.org/t/boundingbox-does-not-affect-occlusion-culling-for-the-model/54050 "2023-07-18T11:20:23Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![MateuszWis](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mateuszwis/32/38322_2.png) [@MateuszWis](https://discourse.threejs.org/u/MateuszWis)\
**Post date:** [July 18, 2023, 11:20am UTC](https://discourse.threejs.org/t/boundingbox-does-not-affect-occlusion-culling-for-the-model/54050/1 "2023-07-18T11:20:23Z")

</div>

here is my result:

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/3/03e8b12807ed5b25d6f05586e7502297c6c9144c.png)

so i change the height of some of my geometry and camera culling acts like i never change them and the disapear near the bottom of my view

Here is my code that changes geometry

```javascript
  set height(value: number) {
    if (!this._movable) return;
    this._height = value;
    const dif = value - this._baseHeight;
    const rightPosition = this.right.geometry.getAttribute('position');
    const leftPosition = this.left.geometry.getAttribute('position');
    const basePosition = this._baseGeometry.getAttribute('position');
    for (var i = 0; i < this._topVerticesSection.indexes.length; i++) {
      const index = this._topVerticesSection.indexes[i];
      const y = basePosition.getY(index) + dif;
      console.log(basePosition.getY(index));
      rightPosition.setY(index, y);
      leftPosition.setY(index, y);
    }
    rightPosition.needsUpdate = true;
    leftPosition.needsUpdate = true;

    this.right.geometry.computeBoundingBox();
    this.left.geometry.computeBoundingBox();
    // this.right.geometry.computeBoundingSphere();
    // this.left.geometry.computeBoundingSphere();
  }

```

this.left and this.right is type of THREE.Mesh

if i uncomment computeBoundingSphere it works, but im affraid that it will calculate my points even if they are not in my view.

I even tried to set boundingBox to

```javascript
new Box3(new Vector3(-300,-300,-300), new Vector3(300,300,300))

```

it doesnt change anything.

after computeBoundingBox()  
console.log(this.right.geometry.boundingBox); shows

```javascript
Box3(
 Vector3(-0.17794036865234375, y: 0.4462258815765381, z: -1.181008338928222),
 Vector3(6.9234161376953125, y: 58.45136260986328, z: 3.295577049255371)
)

```

Whitch is wrong maxY should be around 116 after geometry changes

Any ideas what am i doing wrong?

---

<div class="post-metadata">

**Author:** ![PavelBoytchev](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pavelboytchev/32/38639_2.png) [@PavelBoytchev](https://discourse.threejs.org/u/PavelBoytchev)\
**Post date:** [July 19, 2023, 6:19am UTC](https://discourse.threejs.org/t/boundingbox-does-not-affect-occlusion-culling-for-the-model/54050/2 "2023-07-19T06:19:02Z")

</div>

Just by looking at the code, I cannot see any problem. When I try to replicate the problem (updating the position attribute values and computing bounding box) – it works well. Any chances to prepare some online debuggable code (CodePen, JSFiddle, CodeSandbox, etc)?

In the code only specific elements of the buffer array are changed depending on `_topVerticesSection`. Without debugging it is impossible to check this:

- `computeBoundingBox` uses only the first `count` vertices in `position`
- the data array in `position` could be longer
- if you change data beyond `count` it will not be used by `computeBoundingBox`

If I were you, I will check what values are written, in what position they are written and whether they are used afterwords. Also, I will try with simpler code, by removing parts of the code, just to test bounding boxes, e.g.:

```javascript
  set height(value: number) {
    const rightPosition = this.right.geometry.getAttribute('position');
    for (var i = 0; i < rightPosition.count; i++) {
      const y = rightPosition.getY(i) + 1000;
      rightPosition.setY(i, y);
    }
    this.right.geometry.computeBoundingBox();
  }

```

If this code works, then it indicates something in the removed parts causes the problem.

And finally, I will also check whether the `console.log` are correct. There is some non-zero chance that the wrong values are printed. For example, in the code, the original values of `y` are logged in the console, and you might be confused if you see the console log and assume these are modified `y` values.

Most likely all above is just irrelevant, but I hope you could debug your code and resolve the problem.

* * *

PS. Also have in mind this: in some cases Three.js algorithms use the bounding box, in other cases it uses the bounding sphere. I think it might be a problem if you change the geometry and update only the bounding box. All checks that rely on bounding sphere will use the bounding sphere for the old data, thus they will ‘not see’ that the geometry has changed.

---

<div class="post-metadata">

**Author:** ![MateuszWis](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mateuszwis/32/38322_2.png) [@MateuszWis](https://discourse.threejs.org/u/MateuszWis)\
**Post date:** [July 21, 2023, 4:58am UTC](https://discourse.threejs.org/t/boundingbox-does-not-affect-occlusion-culling-for-the-model/54050/3 "2023-07-21T04:58:40Z")

</div>

I dont really have time to create an online example, but some of my bounding boxes are calculated, and are still culled. Perhaps it works, but Three.js algorithms are using bounding sphere insted of bounding box

i’ll use bounding sphere for now, maybe I will come back to this topic later on

Thank you