# BVHHelper

class in `three-mesh-bvh`, extends `Group`

```js
import { BVHHelper } from 'three-mesh-bvh';
```

A `THREE.Group` that visualizes a BVH as wireframe bounding boxes or solid
face overlays. Attach it as a sibling of the mesh in the scene graph and
call `update()` whenever the mesh's BVH or world transform changes.

Example: Visualizing a mesh's BVH

```js
import { Mesh, TorusKnotGeometry, MeshNormalMaterial } from 'three';
import { MeshBVH, BVHHelper } from 'three-mesh-bvh';

// scene, camera and renderer are initialized here

const mesh = new Mesh( new TorusKnotGeometry( 1, 0.3, 200, 30 ), new MeshNormalMaterial() );
mesh.geometry.boundsTree = new MeshBVH( mesh.geometry );

const helper = new BVHHelper( mesh, 10 );
helper.traverse( object => object.frustumCulled = false );
scene.add( mesh, helper );
```

## Constructor

```js
new BVHHelper( mesh?: Object3D | GeometryBVH | null, bvh?: GeometryBVH | number | null, depth?: number )
```

- `mesh`, `Object3D | GeometryBVH | null`, optional, default `null`: The mesh whose `geometry.boundsTree`
  should be displayed, or a `GeometryBVH` to display directly.
- `bvh`, `GeometryBVH | number | null`, optional, default `null`: The BVH to visualize. When the first
  argument is a `GeometryBVH`, this argument is interpreted as `depth`.
- `depth`, `number`, optional, default `10`: Maximum tree depth to display.

## Properties

### .color: Color

readonly

Shortcut to `edgeMaterial.color`.

### .opacity: number

Opacity applied to both edge and mesh materials.

### .depth: number

### .mesh: Object3D | null

### .bvh: GeometryBVH | null

### .displayParents: boolean

### .displayEdges: boolean

### .instanceId: number

### .edgeMaterial: LineBasicMaterial

Material used when rendering in wireframe edge mode.

### .meshMaterial: MeshBasicMaterial

Material used when rendering in solid face mode.

## Methods

### .update

```js
.update(  )
```

Rebuilds the helper's display geometry from the current BVH state. Must
be called after changes to the BVH, `depth`, `displayParents`, or
`displayEdges`.

### .dispose

```js
.dispose(  )
```

Disposes of the materials and geometries used by the helper.