diff --git a/example/fadingTiles.js b/example/fadingTiles.js index 3228543d7..fe6c3d75e 100644 --- a/example/fadingTiles.js +++ b/example/fadingTiles.js @@ -5,7 +5,7 @@ import { OrthographicCamera, Group, } from 'three'; -import { TilesFadePlugin } from './src/plugins/fade/TilesFadePlugin.js'; +import { TilesFadePlugin } from '3d-tiles-renderer/plugins'; import { EnvironmentControls, TilesRenderer, CameraTransitionManager } from '3d-tiles-renderer'; import { GUI } from 'three/examples/jsm/libs/lil-gui.module.min.js'; diff --git a/example/googleMapsAerial.js b/example/googleMapsAerial.js index 77ce59e0b..0fd769d5b 100644 --- a/example/googleMapsAerial.js +++ b/example/googleMapsAerial.js @@ -1,5 +1,5 @@ import { GeoUtils, WGS84_ELLIPSOID, TilesRenderer } from '3d-tiles-renderer'; -import { GoogleCloudAuthPlugin } from '3d-tiles-renderer/plugins'; +import { GoogleCloudAuthPlugin, TilesFadePlugin, TileCompressionPlugin } from '3d-tiles-renderer/plugins'; import { Scene, WebGLRenderer, @@ -11,8 +11,6 @@ import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'; import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'; import { GUI } from 'three/examples/jsm/libs/lil-gui.module.min.js'; import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'; -import { TileCompressionPlugin } from './src/plugins/TileCompressionPlugin.js'; -import { TilesFadePlugin } from './src/plugins/fade/TilesFadePlugin.js'; let camera, controls, scene, renderer, tiles; diff --git a/example/googleMapsExample.js b/example/googleMapsExample.js index ac3aac7e0..6bd66f871 100644 --- a/example/googleMapsExample.js +++ b/example/googleMapsExample.js @@ -6,7 +6,12 @@ import { CameraTransitionManager, TilesRenderer, } from '3d-tiles-renderer'; -import { GoogleCloudAuthPlugin } from '3d-tiles-renderer/plugins'; +import { + GoogleCloudAuthPlugin, + TilesFadePlugin, + UpdateOnChangePlugin, + TileCompressionPlugin, +} from '3d-tiles-renderer/plugins'; import { Scene, WebGLRenderer, @@ -18,9 +23,6 @@ import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'; import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'; import { GUI } from 'three/examples/jsm/libs/lil-gui.module.min.js'; import Stats from 'three/examples/jsm/libs/stats.module.js'; -import { TileCompressionPlugin } from './src/plugins/TileCompressionPlugin.js'; -import { UpdateOnChangePlugin } from './src/plugins/UpdateOnChangePlugin.js'; -import { TilesFadePlugin } from './src/plugins/fade/TilesFadePlugin.js'; import { BatchedTilesPlugin } from './src/plugins/batched/BatchedTilesPlugin.js'; let controls, scene, renderer, tiles, transition; diff --git a/example/ionLunar.js b/example/ionLunar.js index b1f49c877..efefb9baa 100644 --- a/example/ionLunar.js +++ b/example/ionLunar.js @@ -3,16 +3,18 @@ import { TilesRenderer, LUNAR_ELLIPSOID, } from '3d-tiles-renderer'; -import { CesiumIonAuthPlugin } from '3d-tiles-renderer/plugins'; +import { + CesiumIonAuthPlugin, + UpdateOnChangePlugin, + TileCompressionPlugin, + TilesFadePlugin, +} from '3d-tiles-renderer/plugins'; import { Scene, WebGLRenderer, PerspectiveCamera, } from 'three'; -import { TilesFadePlugin } from './src/plugins/fade/TilesFadePlugin.js'; import { GUI } from 'three/examples/jsm/libs/lil-gui.module.min.js'; -import { TileCompressionPlugin } from './src/plugins/TileCompressionPlugin.js'; -import { UpdateOnChangePlugin } from './src/plugins/UpdateOnChangePlugin.js'; let controls, scene, camera, renderer, tiles; diff --git a/example/r3f/basic.jsx b/example/r3f/basic.jsx index 56df30619..23429665a 100644 --- a/example/r3f/basic.jsx +++ b/example/r3f/basic.jsx @@ -3,7 +3,7 @@ import { createRoot } from 'react-dom/client'; import { Canvas, useFrame } from '@react-three/fiber'; import { Environment, GizmoHelper, GizmoViewport, MeshTransmissionMaterial } from '@react-three/drei'; import { TilesPlugin, TilesRenderer, EnvironmentControls } from '3d-tiles-renderer/r3f'; -import { TilesFadePlugin } from '../src/plugins/fade/TilesFadePlugin.js'; +import { TilesFadePlugin } from '3d-tiles-renderer/plugins'; const tilesetUrl = 'https://raw.githubusercontent.com/NASA-AMMOS/3DTilesSampleData/master/msl-dingo-gap/0528_0260184_to_s64o256_colorize/0528_0260184_to_s64o256_colorize/0528_0260184_to_s64o256_colorize_tileset.json'; diff --git a/example/r3f/globe.jsx b/example/r3f/globe.jsx index 77c578cfc..191734f02 100644 --- a/example/r3f/globe.jsx +++ b/example/r3f/globe.jsx @@ -13,11 +13,13 @@ import { } from '3d-tiles-renderer/r3f'; // Plugins -import { GoogleCloudAuthPlugin } from '3d-tiles-renderer/plugins'; +import { + GoogleCloudAuthPlugin, + UpdateOnChangePlugin, + TileCompressionPlugin, + TilesFadePlugin, +} from '3d-tiles-renderer/plugins'; import { GLTFExtensionsPlugin } from '../src/plugins/GLTFExtensionsPlugin.js'; -import { TilesFadePlugin } from '../src/plugins/fade/TilesFadePlugin.js'; -import { TileCompressionPlugin } from '../src/plugins/TileCompressionPlugin.js'; -import { UpdateOnChangePlugin } from '../src/plugins/UpdateOnChangePlugin.js'; import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'; // R3F, DREI and LEVA imports diff --git a/example/r3f/ion.jsx b/example/r3f/ion.jsx index 630aefad8..fb37e9e24 100644 --- a/example/r3f/ion.jsx +++ b/example/r3f/ion.jsx @@ -3,12 +3,11 @@ import { createRoot } from 'react-dom/client'; // TilesRenderer, controls and attribution imports import { TilesPlugin, TilesRenderer, TilesAttributionOverlay, EnvironmentControls } from '3d-tiles-renderer/r3f'; -import { CesiumIonAuthPlugin } from '3d-tiles-renderer/plugins'; +import { CesiumIonAuthPlugin, UpdateOnChangePlugin } from '3d-tiles-renderer/plugins'; // Plugins import { GLTFExtensionsPlugin } from '../src/plugins/GLTFExtensionsPlugin.js'; import { ReorientationPlugin } from '../src/plugins/ReorientationPlugin.js'; -import { UpdateOnChangePlugin } from '../src/plugins/UpdateOnChangePlugin.js'; import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'; // R3F, DREI and LEVA imports diff --git a/src/plugins/README.md b/src/plugins/README.md index a97cc38d9..92a478d77 100644 --- a/src/plugins/README.md +++ b/src/plugins/README.md @@ -194,7 +194,7 @@ Plugins to register to the TilesRenderer instance to modify behavior. ```js const tiles = new TilesRenderer( url ); -tiles.registerPlugin( new TilesCompressionPlugin() ); +tiles.registerPlugin( new TileCompressionPlugin() ); tiles.registerPlugin( new TilesFadePlugin() ); ``` @@ -404,7 +404,7 @@ unregisterLayer( name : string ) : void hasLayer( name : string ) : boolean ``` -## TilesCompressionPlugin +## TileCompressionPlugin _available in the examples directory_ diff --git a/src/plugins/index.d.ts b/src/plugins/index.d.ts index 2538f89ae..5aad6a55f 100644 --- a/src/plugins/index.d.ts +++ b/src/plugins/index.d.ts @@ -1,6 +1,9 @@ // three.js plugins export { CesiumIonAuthPlugin } from './three/CesiumIonAuthPlugin'; export { GoogleCloudAuthPlugin } from './three/GoogleCloudAuthPlugin'; +export { UpdateOnChangePlugin } from './three/UpdateOnChangePlugin'; +export { TileCompressionPlugin } from './three/TileCompressionPlugin'; +export { TilesFadePlugin } from './three/fade/TilesFadePlugin'; export * from './three/DebugTilesPlugin'; // common plugins diff --git a/src/plugins/index.js b/src/plugins/index.js index 22e83cb67..45c56c506 100644 --- a/src/plugins/index.js +++ b/src/plugins/index.js @@ -1,6 +1,9 @@ // three.js plugins export { CesiumIonAuthPlugin } from './three/CesiumIonAuthPlugin.js'; export { GoogleCloudAuthPlugin } from './three/GoogleCloudAuthPlugin.js'; +export { UpdateOnChangePlugin } from './three/UpdateOnChangePlugin.js'; +export { TileCompressionPlugin } from './three/TileCompressionPlugin.js'; +export { TilesFadePlugin } from './three/fade/TilesFadePlugin.js'; export * from './three/DebugTilesPlugin.js'; // common plugins diff --git a/src/plugins/three/TileCompressionPlugin.d.ts b/src/plugins/three/TileCompressionPlugin.d.ts new file mode 100644 index 000000000..b190bc9e4 --- /dev/null +++ b/src/plugins/three/TileCompressionPlugin.d.ts @@ -0,0 +1,18 @@ +import { TypedArray } from 'three'; + +export class TileCompressionPlugin { + + constructor( options: { + generateNormals: Boolean, + disableMipmaps: Boolean, + compressIndex: Boolean, + compressNormals: Boolean, + compressUvs: Boolean, + compressPosition: Boolean, + + uvType: TypedArray, + normalType: TypedArray, + positionType: TypedArray, + } ); + +} diff --git a/example/src/plugins/TileCompressionPlugin.js b/src/plugins/three/TileCompressionPlugin.js similarity index 94% rename from example/src/plugins/TileCompressionPlugin.js rename to src/plugins/three/TileCompressionPlugin.js index cdd120c43..be953fdb3 100644 --- a/example/src/plugins/TileCompressionPlugin.js +++ b/src/plugins/three/TileCompressionPlugin.js @@ -1,4 +1,6 @@ +import { MeshNormalMaterial } from 'three'; import { Vector3, LinearFilter, BufferAttribute, MathUtils } from 'three'; +import { toCreasedNormals } from 'three/examples/jsm/utils/BufferGeometryUtils.js'; const _vec = new Vector3(); function compressAttribute( attribute, arrayType ) { @@ -167,7 +169,7 @@ export class TileCompressionPlugin { // handle geometry attribute compression if ( c.geometry ) { - const geometry = c.geometry; + let geometry = c.geometry; const attributes = geometry.attributes; if ( compressUvs ) { @@ -181,7 +183,10 @@ export class TileCompressionPlugin { if ( generateNormals && ! attributes.normals ) { - geometry.computeVertexNormals(); + geometry = toCreasedNormals( geometry, 30 * MathUtils.DEG2RAD ); + c.geometry = geometry; + + c.material = new MeshNormalMaterial(); } diff --git a/src/plugins/three/UpdateOnChange.d.ts b/src/plugins/three/UpdateOnChange.d.ts new file mode 100644 index 000000000..94a9a0a7b --- /dev/null +++ b/src/plugins/three/UpdateOnChange.d.ts @@ -0,0 +1,5 @@ +export class UpdateOnChangePlugin { + + constructor(); + +} diff --git a/example/src/plugins/UpdateOnChangePlugin.js b/src/plugins/three/UpdateOnChangePlugin.js similarity index 100% rename from example/src/plugins/UpdateOnChangePlugin.js rename to src/plugins/three/UpdateOnChangePlugin.js diff --git a/example/src/plugins/fade/FadeManager.js b/src/plugins/three/fade/FadeManager.js similarity index 100% rename from example/src/plugins/fade/FadeManager.js rename to src/plugins/three/fade/FadeManager.js diff --git a/src/plugins/three/fade/TilesFadePlugin.d.ts b/src/plugins/three/fade/TilesFadePlugin.d.ts new file mode 100644 index 000000000..6e3ce026c --- /dev/null +++ b/src/plugins/three/fade/TilesFadePlugin.d.ts @@ -0,0 +1,9 @@ +export class TilesFadePlugin { + + constructor( options: { + maximumFadeOutTiles: Number, + fadeRootTiles: Boolean, + fadeDuration: Number, + } ); + +} diff --git a/example/src/plugins/fade/TilesFadePlugin.js b/src/plugins/three/fade/TilesFadePlugin.js similarity index 100% rename from example/src/plugins/fade/TilesFadePlugin.js rename to src/plugins/three/fade/TilesFadePlugin.js