Level of Detail - show meshes with more or less geometry based on distance from the camera.

Every level is associated with an object, and rendering can be switched between them at the distances specified. Typically you would create, say, three meshes, one for far away (low detail), one for mid range (medium detail) and one for close up (high detail).

Example


var lod = new THREE.LOD();

//Create spheres with 3 levels of detail and create new LOD levels for them
for( var i = 0; i < 3; i++ ) {

	var geometry = new THREE.IcosahedronBufferGeometry( 10, 3 - i )

	var mesh = new THREE.Mesh( geometry, material );

	lod.addLevel( mesh, i * 75 );

}

scene.add( lod );

Note that for the LOD to switch between the different detail levels, you will have to call [page:.update update]( camera ) in your render loop. See the source code for this example for details: [example:webgl_lod WebGL / LOD]

Constructor

[name]( )

Properties

[property:array levels]

An array of [page:object level] objects

Each level is an object with two properties:
[page:Object3D object] - The [page:Object3D] to display at this level.
[page:Float distance] - The distance at which to display this level of detail.

Methods

[method:null addLevel]( [param:Object3D object], [param:Float distance] )

[page:Object3D object] - The [page:Object3D] to display at this level.
[page:Float distance] - The distance at which to display this level of detail.

Adds a mesh that will display at a certain distance and greater. Typically the further away the distance, the lower the detail on the mesh.

[method:LOD clone]()

[method:Object3D getObjectForDistance]( [param:Float distance] )

[method:Array raycast]( [param:Raycaster raycaster], [param:Array intersects] )

[method:null toJSON]( meta )

[method:null update]( [param:Camera camera] )

Set the visibility of each [page:levels level]'s [page:Object3D object] based on distance from the [page:Camera camera]. This needs to be called in the render loop for levels of detail to be updated dynamically.

[name]