Add BatchedTilesPlugin (#800)

* Add BatchedTilesPlugin

* Add start to expanding batched mesh

* Split out ExpandingBatchedMesh

* Clean up

* small fixes

* Progress on getting things working

* Check revision

* Texture fixes

* Small fixes

* Some fixes to geometry expansion

* remove extra count

* Fix rendering

* Fix instance deletion

* Remove frustum culling

* Get everything working

* Fix score

* Update raycasting logic

* Add raycasting support

* Update material support

* Add docs

* updates

* Fix disposal

* Handle all already loaded models

* Add comments

* more comments

* fix disposal

* some fixes

* Remove unused fields

* Add model view batched mesh

* Adjust the model view batched mesh to use camera offset

* Temporarily remove mipmaps

* Handle cases where tiles have multiple geometries

* Remove override

* fix use of free ids

* Limit the amount of instances to the size of a 3d texture

* Add stand in options

* Adjust instance count check

* Support multiple geometries per tile

* Handle incongruent attributes, texturs

* Update plugin

Author: gkjohnson

PLUGINS.md

@@ -538,6 +538,45 @@ transformLatLonHeightToOrigin( lat, lon, height = 0 ) : void
 
 Transforms the centers the tile set such that the given coordinates and height are positioned at the origin with "X" facing west and "Z" facing north.
 
+## BatchedTilesPlugin
+
+_available in the examples directory_
+
+Plugin that uses three.js' BatchedMesh to limit the number of draw calls required and improve performance. The BatchedMesh geometry and instance size are automatically resized and optimized as new geometry is added and removed. The max number of instances to generate is limited by the max size of a 3d texture.
+
+> [!WARNING]
+> All tile geometry rendered with BatchedMesh will use the same material and only a single material "map" is supported. Only tiles geometry containing a single mesh are supported. Not compatible with other plugins that modify mesh materials or rely on other bespoke mesh data (eg TilesFadePlugin, DebugTilesPlugin, GLTF Metadata extensions).
+
+### .constructor
+
+
+```js
+constructor( options : Object )
+```
+
+Available options are as follows:
+
+```js
+{
+	// WebGLRenderer used for generating a WebGLArrayRenderTarget
+	renderer,
+
+	// The initial number of instances to use for rendering
+	instanceCount: 500,
+
+	// The minimum amount of vertex and index space to save per tile geometry added. If adequate tile space is already allocated
+	// when a new tile geometry is added then it can prevent more expensive geometry resizing and optimization.
+	vertexCount: 1000,
+	indexCount: 1000,
+
+	// The amount to increase the geometry and instance allocation when the operations must occur
+	expandPercent: 0.25,
+
+	// The material to use for the BatchedMesh. The material of the first tile rendered with be used if not set.
+	material: null,
+}
+```
+
 # Controls
 
 ## EnvironmentControls

example/fadingTiles.js

@@ -112,7 +112,10 @@ function reinstantiateTiles() {
 	if ( groundTiles ) {
 
 		groundTiles.dispose();
+		groundTiles.group.removeFromParent();
+
 		skyTiles.dispose();
+		skyTiles.group.removeFromParent();
 
 	}
 

example/googleMapsExample.js

@@ -61,7 +61,6 @@ function reinstantiateTiles() {
 	tiles.registerPlugin( new UpdateOnChangePlugin() );
 	tiles.registerPlugin( new TilesFadePlugin() );
 	tiles.group.rotation.x = - Math.PI / 2;
-	tiles.errorTarget = 50;
 
 	// Note the DRACO compression files need to be supplied via an explicit source.
 	// We use unpkg here but in practice should be provided by the application.

example/src/plugins/batched/ArrayTextureCopyMaterial.js

@@ -0,0 +1,51 @@
+import { MeshBasicMaterial } from 'three';
+
+// A MeshBasicMaterial that supports taking a TextureArray and a layer to render
+export class ArrayTextureCopyMaterial extends MeshBasicMaterial {
+
+	set layer( v ) {
+
+		this._layerUniform.value = v;
+
+	}
+
+	get layer() {
+
+		return this._layerUniform.value;
+
+	}
+
+	constructor( ...args ) {
+
+		super( ...args );
+		this._layerUniform = { value: 0 };
+
+	}
+
+	onBeforeCompile( shader ) {
+
+		shader.uniforms.layer = this._layerUniform;
+
+		shader.fragmentShader = shader.fragmentShader
+			.replace(
+				'#include <map_pars_fragment>',
+				/* glsl */`
+				#ifdef USE_MAP
+					precision highp sampler2DArray;
+					uniform sampler2DArray map;
+					uniform int layer;
+				#endif
+				`,
+			)
+			.replace(
+				'#include <map_fragment>',
+				/* glsl */`
+				#ifdef USE_MAP
+					diffuseColor *= texture( map, vec3( vMapUv, layer ) );
+				#endif
+				`
+			);
+
+	}
+
+}