Camera controls for navigating a globe-shaped tileset. Extends EnvironmentControls with ellipsoid-aware rotation, globe inertia, and automatic near/far plane adjustment.
import { TilesRenderer, GlobeControls } from '3d-tiles-renderer/three';
import { GeneratedSurfacePlugin, XYZTilesOverlay } from '3d-tiles-renderer/three/plugins';
// scene, camera and renderer are initialized here
const URL = 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}';
const tiles = new TilesRenderer();
tiles.registerPlugin( new GeneratedSurfacePlugin( {
overlay: new XYZTilesOverlay( { url: URL } ),
applyOverlayTexture: true,
} ) );
tiles.setCamera( camera );
tiles.group.rotation.x = - Math.PI / 2;
scene.add( tiles.group );
camera.position.set( 0, 0, 1.75e7 );
const controls = new GlobeControls( scene, camera, renderer.domElement );
controls.setEllipsoid( tiles.ellipsoid, tiles.group );
controls.enableDamping = true;
renderer.setAnimationLoop( () => {
controls.update();
camera.updateMatrixWorld();
tiles.setResolutionFromRenderer( camera, renderer );
tiles.update();
renderer.render( scene, camera );
} );On this page
Properties
The world matrix of ellipsoidGroup, representing the ellipsoid's coordinate frame.
The inverse of ellipsoidFrame.
nearMargin: number = 0.25
Fraction of the near plane distance added as a buffer.
farMargin: number = 0
Fraction of the far plane distance added as a buffer.
globeInertia: Quaternion = new Quaternion()
Accumulated globe rotation inertia quaternion. Applied each frame when globe inertia is active.
globeInertiaFactor: number = 0
Magnitude of the current globe rotation inertia. Decays to zero over time.
The ellipsoid model used for surface interaction and up-direction calculation.
ellipsoidGroup: Group = new Group()
The Three.js group whose world matrix defines the ellipsoid's coordinate frame.
Methods
new GlobeControls(
// The scene to raycast against for surface interaction.
scene: Object3D = null,
// The camera to control.
camera: Camera = null,
// The DOM element to attach pointer events to.
domElement: HTMLElement = null
)setEllipsoid(
// Ellipsoid to use. Defaults to a WGS84 clone.
ellipsoid?: Ellipsoid,
// Group whose world matrix defines the ellipsoid frame.
ellipsoidGroup?: Group
): voidSets the ellipsoid model and its scene group for globe-aware interaction.
getVectorToCenter( target: Vector3 ): Vector3Returns the vector from the camera to the center of the ellipsoid in world space.
getDistanceToCenter(): numberReturns the distance from the camera to the center of the ellipsoid.