📄 `CubeCamera.js`¶

📊 Analysis Summary¶

Metric	Count
🔧 Functions	2
🧱 Classes	1
📦 Imports	4
📊 Variables & Constants	11

📚 Table of Contents¶

Imports
Variables & Constants
Functions
Classes

🛠️ File Location:¶

📂 src/cameras/CubeCamera.js

📦 Imports¶

Name	Source
`WebGLCoordinateSystem`	`../constants.js`
`WebGPUCoordinateSystem`	`../constants.js`
`Object3D`	`../core/Object3D.js`
`PerspectiveCamera`	`./PerspectiveCamera.js`

Variables & Constants¶

Name	Type	Kind	Value	Exported
`fov`	`-90`	let/var	`- 90`	✗
`aspect`	`1`	let/var	`1`	✗
`cameraPX`	`PerspectiveCamera`	let/var	`new PerspectiveCamera( fov, aspect, near, far )`	✗
`cameraNX`	`PerspectiveCamera`	let/var	`new PerspectiveCamera( fov, aspect, near, far )`	✗
`cameraPY`	`PerspectiveCamera`	let/var	`new PerspectiveCamera( fov, aspect, near, far )`	✗
`cameraNY`	`PerspectiveCamera`	let/var	`new PerspectiveCamera( fov, aspect, near, far )`	✗
`cameraPZ`	`PerspectiveCamera`	let/var	`new PerspectiveCamera( fov, aspect, near, far )`	✗
`cameraNZ`	`PerspectiveCamera`	let/var	`new PerspectiveCamera( fov, aspect, near, far )`	✗
`coordinateSystem`	`number`	let/var	`this.coordinateSystem`	✗
`currentXrEnabled`	`any`	let/var	`renderer.xr.enabled`	✗
`generateMipmaps`	`any`	let/var	`renderTarget.texture.generateMipmaps`	✗

Functions¶

`CubeCamera.updateCoordinateSystem(): void`¶

JSDoc:

/**
     * Must be called when the coordinate system of the cube camera is changed.
     */

Returns: void

Calls:

this.children.concat
this.remove
cameraPX.up.set
cameraPX.lookAt
cameraNX.up.set
cameraNX.lookAt
cameraPY.up.set
cameraPY.lookAt
cameraNY.up.set
cameraNY.lookAt
cameraPZ.up.set
cameraPZ.lookAt
cameraNZ.up.set
cameraNZ.lookAt
this.add
camera.updateMatrixWorld

Code

updateCoordinateSystem() {

        const coordinateSystem = this.coordinateSystem;

        const cameras = this.children.concat();

        const [ cameraPX, cameraNX, cameraPY, cameraNY, cameraPZ, cameraNZ ] = cameras;

        for ( const camera of cameras ) this.remove( camera );

        if ( coordinateSystem === WebGLCoordinateSystem ) {

            cameraPX.up.set( 0, 1, 0 );
            cameraPX.lookAt( 1, 0, 0 );

            cameraNX.up.set( 0, 1, 0 );
            cameraNX.lookAt( - 1, 0, 0 );

            cameraPY.up.set( 0, 0, - 1 );
            cameraPY.lookAt( 0, 1, 0 );

            cameraNY.up.set( 0, 0, 1 );
            cameraNY.lookAt( 0, - 1, 0 );

            cameraPZ.up.set( 0, 1, 0 );
            cameraPZ.lookAt( 0, 0, 1 );

            cameraNZ.up.set( 0, 1, 0 );
            cameraNZ.lookAt( 0, 0, - 1 );

        } else if ( coordinateSystem === WebGPUCoordinateSystem ) {

            cameraPX.up.set( 0, - 1, 0 );
            cameraPX.lookAt( - 1, 0, 0 );

            cameraNX.up.set( 0, - 1, 0 );
            cameraNX.lookAt( 1, 0, 0 );

            cameraPY.up.set( 0, 0, 1 );
            cameraPY.lookAt( 0, 1, 0 );

            cameraNY.up.set( 0, 0, - 1 );
            cameraNY.lookAt( 0, - 1, 0 );

            cameraPZ.up.set( 0, - 1, 0 );
            cameraPZ.lookAt( 0, 0, 1 );

            cameraNZ.up.set( 0, - 1, 0 );
            cameraNZ.lookAt( 0, 0, - 1 );

        } else {

            throw new Error( 'THREE.CubeCamera.updateCoordinateSystem(): Invalid coordinate system: ' + coordinateSystem );

        }

        for ( const camera of cameras ) {

            this.add( camera );

            camera.updateMatrixWorld();

        }

    }

`CubeCamera.update(renderer: any, scene: Scene): void`¶

JSDoc:

/**
     * Calling this method will render the given scene with the given renderer
     * into the cube render target of the camera.
     *
     * @param {(Renderer|WebGLRenderer)} renderer - The renderer.
     * @param {Scene} scene - The scene to render.
     */

Parameters:

renderer any
scene Scene

Returns: void

Calls:

this.updateMatrixWorld
this.updateCoordinateSystem
renderer.getRenderTarget
renderer.getActiveCubeFace
renderer.getActiveMipmapLevel
renderer.setRenderTarget
renderer.render

Internal Comments:

// mipmaps are generated during the last call of render() (x5)
// at this point, all sides of the cube render target are defined (x5)

Code

update( renderer, scene ) {

        if ( this.parent === null ) this.updateMatrixWorld();

        const { renderTarget, activeMipmapLevel } = this;

        if ( this.coordinateSystem !== renderer.coordinateSystem ) {

            this.coordinateSystem = renderer.coordinateSystem;

            this.updateCoordinateSystem();

        }

        const [ cameraPX, cameraNX, cameraPY, cameraNY, cameraPZ, cameraNZ ] = this.children;

        const currentRenderTarget = renderer.getRenderTarget();
        const currentActiveCubeFace = renderer.getActiveCubeFace();
        const currentActiveMipmapLevel = renderer.getActiveMipmapLevel();

        const currentXrEnabled = renderer.xr.enabled;

        renderer.xr.enabled = false;

        const generateMipmaps = renderTarget.texture.generateMipmaps;

        renderTarget.texture.generateMipmaps = false;

        renderer.setRenderTarget( renderTarget, 0, activeMipmapLevel );
        renderer.render( scene, cameraPX );

        renderer.setRenderTarget( renderTarget, 1, activeMipmapLevel );
        renderer.render( scene, cameraNX );

        renderer.setRenderTarget( renderTarget, 2, activeMipmapLevel );
        renderer.render( scene, cameraPY );

        renderer.setRenderTarget( renderTarget, 3, activeMipmapLevel );
        renderer.render( scene, cameraNY );

        renderer.setRenderTarget( renderTarget, 4, activeMipmapLevel );
        renderer.render( scene, cameraPZ );

        // mipmaps are generated during the last call of render()
        // at this point, all sides of the cube render target are defined

        renderTarget.texture.generateMipmaps = generateMipmaps;

        renderer.setRenderTarget( renderTarget, 5, activeMipmapLevel );
        renderer.render( scene, cameraNZ );

        renderer.setRenderTarget( currentRenderTarget, currentActiveCubeFace, currentActiveMipmapLevel );

        renderer.xr.enabled = currentXrEnabled;

        renderTarget.texture.needsPMREMUpdate = true;

    }

Classes¶

`CubeCamera`¶

Class Code

class CubeCamera extends Object3D {

    /**
     * Constructs a new cube camera.
     *
     * @param {number} near - The camera's near plane.
     * @param {number} far - The camera's far plane.
     * @param {WebGLCubeRenderTarget} renderTarget - The cube render target.
     */
    constructor( near, far, renderTarget ) {

        super();

        this.type = 'CubeCamera';

        /**
         * A reference to the cube render target.
         *
         * @type {WebGLCubeRenderTarget}
         */
        this.renderTarget = renderTarget;

        /**
         * The current active coordinate system.
         *
         * @type {?(WebGLCoordinateSystem|WebGPUCoordinateSystem)}
         * @default null
         */
        this.coordinateSystem = null;

        /**
         * The current active mipmap level
         *
         * @type {number}
         * @default 0
         */
        this.activeMipmapLevel = 0;

        const cameraPX = new PerspectiveCamera( fov, aspect, near, far );
        cameraPX.layers = this.layers;
        this.add( cameraPX );

        const cameraNX = new PerspectiveCamera( fov, aspect, near, far );
        cameraNX.layers = this.layers;
        this.add( cameraNX );

        const cameraPY = new PerspectiveCamera( fov, aspect, near, far );
        cameraPY.layers = this.layers;
        this.add( cameraPY );

        const cameraNY = new PerspectiveCamera( fov, aspect, near, far );
        cameraNY.layers = this.layers;
        this.add( cameraNY );

        const cameraPZ = new PerspectiveCamera( fov, aspect, near, far );
        cameraPZ.layers = this.layers;
        this.add( cameraPZ );

        const cameraNZ = new PerspectiveCamera( fov, aspect, near, far );
        cameraNZ.layers = this.layers;
        this.add( cameraNZ );

    }

    /**
     * Must be called when the coordinate system of the cube camera is changed.
     */
    updateCoordinateSystem() {

        const coordinateSystem = this.coordinateSystem;

        const cameras = this.children.concat();

        const [ cameraPX, cameraNX, cameraPY, cameraNY, cameraPZ, cameraNZ ] = cameras;

        for ( const camera of cameras ) this.remove( camera );

        if ( coordinateSystem === WebGLCoordinateSystem ) {

            cameraPX.up.set( 0, 1, 0 );
            cameraPX.lookAt( 1, 0, 0 );

            cameraNX.up.set( 0, 1, 0 );
            cameraNX.lookAt( - 1, 0, 0 );

            cameraPY.up.set( 0, 0, - 1 );
            cameraPY.lookAt( 0, 1, 0 );

            cameraNY.up.set( 0, 0, 1 );
            cameraNY.lookAt( 0, - 1, 0 );

            cameraPZ.up.set( 0, 1, 0 );
            cameraPZ.lookAt( 0, 0, 1 );

            cameraNZ.up.set( 0, 1, 0 );
            cameraNZ.lookAt( 0, 0, - 1 );

        } else if ( coordinateSystem === WebGPUCoordinateSystem ) {

            cameraPX.up.set( 0, - 1, 0 );
            cameraPX.lookAt( - 1, 0, 0 );

            cameraNX.up.set( 0, - 1, 0 );
            cameraNX.lookAt( 1, 0, 0 );

            cameraPY.up.set( 0, 0, 1 );
            cameraPY.lookAt( 0, 1, 0 );

            cameraNY.up.set( 0, 0, - 1 );
            cameraNY.lookAt( 0, - 1, 0 );

            cameraPZ.up.set( 0, - 1, 0 );
            cameraPZ.lookAt( 0, 0, 1 );

            cameraNZ.up.set( 0, - 1, 0 );
            cameraNZ.lookAt( 0, 0, - 1 );

        } else {

            throw new Error( 'THREE.CubeCamera.updateCoordinateSystem(): Invalid coordinate system: ' + coordinateSystem );

        }

        for ( const camera of cameras ) {

            this.add( camera );

            camera.updateMatrixWorld();

        }

    }

    /**
     * Calling this method will render the given scene with the given renderer
     * into the cube render target of the camera.
     *
     * @param {(Renderer|WebGLRenderer)} renderer - The renderer.
     * @param {Scene} scene - The scene to render.
     */
    update( renderer, scene ) {

        if ( this.parent === null ) this.updateMatrixWorld();

        const { renderTarget, activeMipmapLevel } = this;

        if ( this.coordinateSystem !== renderer.coordinateSystem ) {

            this.coordinateSystem = renderer.coordinateSystem;

            this.updateCoordinateSystem();

        }

        const [ cameraPX, cameraNX, cameraPY, cameraNY, cameraPZ, cameraNZ ] = this.children;

        const currentRenderTarget = renderer.getRenderTarget();
        const currentActiveCubeFace = renderer.getActiveCubeFace();
        const currentActiveMipmapLevel = renderer.getActiveMipmapLevel();

        const currentXrEnabled = renderer.xr.enabled;

        renderer.xr.enabled = false;

        const generateMipmaps = renderTarget.texture.generateMipmaps;

        renderTarget.texture.generateMipmaps = false;

        renderer.setRenderTarget( renderTarget, 0, activeMipmapLevel );
        renderer.render( scene, cameraPX );

        renderer.setRenderTarget( renderTarget, 1, activeMipmapLevel );
        renderer.render( scene, cameraNX );

        renderer.setRenderTarget( renderTarget, 2, activeMipmapLevel );
        renderer.render( scene, cameraPY );

        renderer.setRenderTarget( renderTarget, 3, activeMipmapLevel );
        renderer.render( scene, cameraNY );

        renderer.setRenderTarget( renderTarget, 4, activeMipmapLevel );
        renderer.render( scene, cameraPZ );

        // mipmaps are generated during the last call of render()
        // at this point, all sides of the cube render target are defined

        renderTarget.texture.generateMipmaps = generateMipmaps;

        renderer.setRenderTarget( renderTarget, 5, activeMipmapLevel );
        renderer.render( scene, cameraNZ );

        renderer.setRenderTarget( currentRenderTarget, currentActiveCubeFace, currentActiveMipmapLevel );

        renderer.xr.enabled = currentXrEnabled;

        renderTarget.texture.needsPMREMUpdate = true;

    }

}

Methods¶

`updateCoordinateSystem(): void`¶

Code

updateCoordinateSystem() {

        const coordinateSystem = this.coordinateSystem;

        const cameras = this.children.concat();

        const [ cameraPX, cameraNX, cameraPY, cameraNY, cameraPZ, cameraNZ ] = cameras;

        for ( const camera of cameras ) this.remove( camera );

        if ( coordinateSystem === WebGLCoordinateSystem ) {

            cameraPX.up.set( 0, 1, 0 );
            cameraPX.lookAt( 1, 0, 0 );

            cameraNX.up.set( 0, 1, 0 );
            cameraNX.lookAt( - 1, 0, 0 );

            cameraPY.up.set( 0, 0, - 1 );
            cameraPY.lookAt( 0, 1, 0 );

            cameraNY.up.set( 0, 0, 1 );
            cameraNY.lookAt( 0, - 1, 0 );

            cameraPZ.up.set( 0, 1, 0 );
            cameraPZ.lookAt( 0, 0, 1 );

            cameraNZ.up.set( 0, 1, 0 );
            cameraNZ.lookAt( 0, 0, - 1 );

        } else if ( coordinateSystem === WebGPUCoordinateSystem ) {

            cameraPX.up.set( 0, - 1, 0 );
            cameraPX.lookAt( - 1, 0, 0 );

            cameraNX.up.set( 0, - 1, 0 );
            cameraNX.lookAt( 1, 0, 0 );

            cameraPY.up.set( 0, 0, 1 );
            cameraPY.lookAt( 0, 1, 0 );

            cameraNY.up.set( 0, 0, - 1 );
            cameraNY.lookAt( 0, - 1, 0 );

            cameraPZ.up.set( 0, - 1, 0 );
            cameraPZ.lookAt( 0, 0, 1 );

            cameraNZ.up.set( 0, - 1, 0 );
            cameraNZ.lookAt( 0, 0, - 1 );

        } else {

            throw new Error( 'THREE.CubeCamera.updateCoordinateSystem(): Invalid coordinate system: ' + coordinateSystem );

        }

        for ( const camera of cameras ) {

            this.add( camera );

            camera.updateMatrixWorld();

        }

    }

`update(renderer: any, scene: Scene): void`¶

Code

update( renderer, scene ) {

        if ( this.parent === null ) this.updateMatrixWorld();

        const { renderTarget, activeMipmapLevel } = this;

        if ( this.coordinateSystem !== renderer.coordinateSystem ) {

            this.coordinateSystem = renderer.coordinateSystem;

            this.updateCoordinateSystem();

        }

        const [ cameraPX, cameraNX, cameraPY, cameraNY, cameraPZ, cameraNZ ] = this.children;

        const currentRenderTarget = renderer.getRenderTarget();
        const currentActiveCubeFace = renderer.getActiveCubeFace();
        const currentActiveMipmapLevel = renderer.getActiveMipmapLevel();

        const currentXrEnabled = renderer.xr.enabled;

        renderer.xr.enabled = false;

        const generateMipmaps = renderTarget.texture.generateMipmaps;

        renderTarget.texture.generateMipmaps = false;

        renderer.setRenderTarget( renderTarget, 0, activeMipmapLevel );
        renderer.render( scene, cameraPX );

        renderer.setRenderTarget( renderTarget, 1, activeMipmapLevel );
        renderer.render( scene, cameraNX );

        renderer.setRenderTarget( renderTarget, 2, activeMipmapLevel );
        renderer.render( scene, cameraPY );

        renderer.setRenderTarget( renderTarget, 3, activeMipmapLevel );
        renderer.render( scene, cameraNY );

        renderer.setRenderTarget( renderTarget, 4, activeMipmapLevel );
        renderer.render( scene, cameraPZ );

        // mipmaps are generated during the last call of render()
        // at this point, all sides of the cube render target are defined

        renderTarget.texture.generateMipmaps = generateMipmaps;

        renderer.setRenderTarget( renderTarget, 5, activeMipmapLevel );
        renderer.render( scene, cameraNZ );

        renderer.setRenderTarget( currentRenderTarget, currentActiveCubeFace, currentActiveMipmapLevel );

        renderer.xr.enabled = currentXrEnabled;

        renderTarget.texture.needsPMREMUpdate = true;

    }

📄 CubeCamera.js¶

📊 Analysis Summary¶

📚 Table of Contents¶

🛠️ File Location:¶

📦 Imports¶

Variables & Constants¶

Functions¶

CubeCamera.updateCoordinateSystem(): void¶

CubeCamera.update(renderer: any, scene: Scene): void¶

Classes¶

CubeCamera¶

Methods¶

updateCoordinateSystem(): void¶

update(renderer: any, scene: Scene): void¶

📄 `CubeCamera.js`¶

`CubeCamera.updateCoordinateSystem(): void`¶

`CubeCamera.update(renderer: any, scene: Scene): void`¶

`CubeCamera`¶

`updateCoordinateSystem(): void`¶

`update(renderer: any, scene: Scene): void`¶