Class WebGLRenderer

The WebGL renderer displays your beautifully crafted scenes using WebGL, if your device supports it. This renderer has way better performance than CanvasRenderer.

see https://github.com/mrdoob/three.js/blob/master/src/renderers/WebGLRenderer.js|src/renderers/WebGLRenderer.js

Hierarchy

Implements

Constructors

constructor

Properties

autoClear autoClearColor autoClearDepth autoClearStencil capabilities clippingPlanes debug domElement extensions info localClippingEnabled outputEncoding physicallyCorrectLights pixelRatio properties renderLists shadowMap shadowMapCullFace shadowMapEnabled shadowMapType sortObjects state toneMapping toneMappingExposure vr xr

Methods

animate clear clearColor clearDepth clearStencil clearTarget compile copyFramebufferToTexture copyTextureToTexture copyTextureToTexture3D dispose enableScissorTest forceContextLoss forceContextRestore getActiveCubeFace getActiveMipmapLevel getClearAlpha getClearColor getContext getContextAttributes getCurrentRenderTarget getCurrentViewport getDrawingBufferSize getMaxAnisotropy getPixelRatio getPrecision getRenderTarget getScissor getScissorTest getSize getViewport initTexture readRenderTargetPixels render renderBufferDirect resetGLState resetState setAnimationLoop setClearAlpha setClearColor setDrawingBufferSize setOpaqueSort setPixelRatio setRenderTarget setScissor setScissorTest setSize setTransparentSort setViewport supportsBlendMinMax supportsCompressedTexturePVRTC supportsCompressedTextureS3TC supportsFloatTextures supportsHalfFloatTextures supportsInstancedArrays supportsStandardDerivatives supportsVertexTextures

Constructors

constructor

  • parameters is an optional object with properties defining the renderer's behaviour. The constructor also accepts no parameters at all. In all cases, it will assume sane defaults when parameters are missing.

    Parameters

    Returns WebGLRenderer

Properties

autoClear

autoClear: boolean

Defines whether the renderer should automatically clear its output before rendering.

Default

true

autoClearColor

autoClearColor: boolean

If autoClear is true, defines whether the renderer should clear the color buffer. Default is true.

Default

true

autoClearDepth

autoClearDepth: boolean

If autoClear is true, defines whether the renderer should clear the depth buffer. Default is true.

Default

true

autoClearStencil

autoClearStencil: boolean

If autoClear is true, defines whether the renderer should clear the stencil buffer. Default is true.

Default

true

capabilities

capabilities: WebGLCapabilities

clippingPlanes

clippingPlanes: any[]

Default

[]

debug

debug: WebGLDebug

Debug configurations.

Default

domElement

domElement: HTMLCanvasElement

A Canvas where the renderer draws its output. This is automatically created by the renderer in the constructor (if not provided already); you just need to add it to your page.

Default

document.createElementNS( 'http://www.w3.org/1999/xhtml', 'canvas' )

extensions

extensions: WebGLExtensions

info

info: WebGLInfo

localClippingEnabled

localClippingEnabled: boolean

Default

false

outputEncoding

outputEncoding: THREE.TextureEncoding

Default is LinearEncoding.

Default

THREE.LinearEncoding

physicallyCorrectLights

physicallyCorrectLights: boolean

Default

false

pixelRatio

pixelRatio: number

properties

properties: WebGLProperties

renderLists

renderLists: WebGLRenderLists

shadowMap

shadowMap: WebGLShadowMap

shadowMapCullFace

shadowMapCullFace: CullFace

Deprecated

Use .shadowMap.cullFace instead.

shadowMapEnabled

shadowMapEnabled: boolean

Deprecated

Use .shadowMap.enabled instead.

shadowMapType

shadowMapType: ShadowMapType

Deprecated

Use .shadowMap.type instead.

sortObjects

sortObjects: boolean

Defines whether the renderer should sort objects. Default is true.

Default

true

state

state: WebGLState

toneMapping

toneMapping: ToneMapping

Default

THREE.NoToneMapping

toneMappingExposure

toneMappingExposure: number

Default

1

vr

vr: boolean

Deprecated

Use .xr instead.

xr

xr: WebXRManager

Methods

animate

  • Deprecated

    Use .setAnimationLoop() instead.

    Parameters

    • callback: (() => void)
        • (): void

        • Returns void

    Returns void

clear

  • Tells the renderer to clear its color, depth or stencil drawing buffer(s). Arguments default to true

    Parameters

    • Optional color: boolean
    • Optional depth: boolean
    • Optional stencil: boolean

    Returns void

clearColor

  • Returns void

clearDepth

  • Returns void

clearStencil

  • Returns void

clearTarget

  • Parameters

    Returns void

compile

  • Compiles all materials in the scene with the camera. This is useful to precompile shaders before the first rendering.

    Parameters

    Returns void

copyFramebufferToTexture

  • Copies a region of the currently bound framebuffer into the selected mipmap level of the selected texture. This region is defined by the size of the destination texture's mip level, offset by the input position.

    Parameters

    • position: THREE.Vector2

      Specifies the pixel offset from which to copy out of the framebuffer.

    • texture: Texture

      Specifies the destination texture.

    • Optional level: number

      Specifies the destination mipmap level of the texture.

    Returns void

copyTextureToTexture

  • Copies srcTexture to the specified level of dstTexture, offset by the input position.

    Parameters

    • position: THREE.Vector2

      Specifies the pixel offset into the dstTexture where the copy will occur.

    • srcTexture: Texture

      Specifies the source texture.

    • dstTexture: Texture

      Specifies the destination texture.

    • Optional level: number

      Specifies the destination mipmap level of the texture.

    Returns void

copyTextureToTexture3D

  • Copies the pixels of a texture in the bounds sourceBox in the desination texture starting from the given position.

    Parameters

    • sourceBox: Box3

      Specifies the bounds

    • position: THREE.Vector3

      Specifies the pixel offset into the dstTexture where the copy will occur.

    • srcTexture: Texture

      Specifies the source texture.

    • dstTexture: Data3DTexture | DataArrayTexture

      Specifies the destination texture.

    • Optional level: number

      Specifies the destination mipmap level of the texture.

    Returns void

dispose

  • Returns void

enableScissorTest

  • Deprecated

    Use .setScissorTest() instead.

    Parameters

    • boolean: any

    Returns any

forceContextLoss

  • Returns void

forceContextRestore

  • Returns void

getActiveCubeFace

  • Returns the current active cube face.

    Returns number

getActiveMipmapLevel

  • Returns the current active mipmap level.

    Returns number

getClearAlpha

  • Returns a float with the current clear alpha. Ranges from 0 to 1.

    Returns number

getClearColor

  • Returns a THREE.Color instance with the current clear color.

    Parameters

    Returns Color

getContext

  • Return the WebGL context.

    Returns WebGLRenderingContext | WebGL2RenderingContext

getContextAttributes

  • Returns any

getCurrentRenderTarget

getCurrentViewport

getDrawingBufferSize

getMaxAnisotropy

  • Deprecated

    Use .capabilities.getMaxAnisotropy() instead.

    Returns number

getPixelRatio

  • Returns number

getPrecision

  • Deprecated

    Use .capabilities.precision instead.

    Returns string

getRenderTarget

  • Returns the current render target. If no render target is set, null is returned.

    Returns WebGLRenderTarget

getScissor

getScissorTest

  • Returns true if scissor test is enabled; returns false otherwise.

    Returns boolean

getSize

getViewport

initTexture

  • Initializes the given texture. Can be used to preload a texture rather than waiting until first render (which can cause noticeable lags due to decode and GPU upload overhead).

    Parameters

    • texture: Texture

      The texture to Initialize.

    Returns void

readRenderTargetPixels

  • Parameters

    Returns void

render

  • Render a scene or an object using a camera. The render is done to a previously specified WebGLRenderTarget#renderTarget .renderTarget set by calling .setRenderTarget or to the canvas as usual.

    By default render buffers are cleared before rendering but you can prevent this by setting the property autoClear to false. If you want to prevent only certain buffers being cleared you can set either the autoClearColor, autoClearStencil or autoClearDepth properties to false. To forcibly clear one ore more buffers call .clear.

    Parameters

    Returns void

renderBufferDirect

resetGLState

  • Deprecated

    Use .state.reset() instead.

    Returns void

resetState

  • Can be used to reset the internal WebGL state.

    Returns void

setAnimationLoop

  • A build in function that can be used instead of requestAnimationFrame. For WebXR projects this function must be used.

    Parameters

    • callback: XRFrameRequestCallback

      The function will be called every available frame. If null is passed it will stop any already ongoing animation.

    Returns void

setClearAlpha

  • Parameters

    • alpha: number

    Returns void

setClearColor

  • Sets the clear color, using color for the color and alpha for the opacity.

    Parameters

    Returns void

setDrawingBufferSize

  • Parameters

    • width: number
    • height: number
    • pixelRatio: number

    Returns void

setOpaqueSort

  • Sets the custom opaque sort function for the WebGLRenderLists. Pass null to use the default painterSortStable function.

    Parameters

    • method: ((a: any, b: any) => number)
        • (a: any, b: any): number

        • Parameters

          • a: any
          • b: any

          Returns number

    Returns void

setPixelRatio

  • Parameters

    • value: number

    Returns void

setRenderTarget

  • Sets the active render target.

    Parameters

    Returns void

setScissor

  • Sets the scissor area from (x, y) to (x + width, y + height).

    Parameters

    • x: number | THREE.Vector4
    • Optional y: number
    • Optional width: number
    • Optional height: number

    Returns void

setScissorTest

  • Enable the scissor test. When this is enabled, only the pixels within the defined scissor area will be affected by further renderer actions.

    Parameters

    • enable: boolean

    Returns void

setSize

  • Resizes the output canvas to (width, height), and also sets the viewport to fit that size, starting in (0, 0).

    Parameters

    • width: number
    • height: number
    • Optional updateStyle: boolean

    Returns void

setTransparentSort

  • Sets the custom transparent sort function for the WebGLRenderLists. Pass null to use the default reversePainterSortStable function.

    Parameters

    • method: ((a: any, b: any) => number)
        • (a: any, b: any): number

        • Parameters

          • a: any
          • b: any

          Returns number

    Returns void

setViewport

  • Sets the viewport to render from (x, y) to (x + width, y + height). (x, y) is the lower-left corner of the region.

    Parameters

    • x: number | THREE.Vector4
    • Optional y: number
    • Optional width: number
    • Optional height: number

    Returns void

supportsBlendMinMax

supportsCompressedTexturePVRTC

supportsCompressedTextureS3TC

supportsFloatTextures

supportsHalfFloatTextures

supportsInstancedArrays

supportsStandardDerivatives

supportsVertexTextures

  • Deprecated

    Use .capabilities.vertexTextures instead.

    Returns any

Settings

Member Visibility

Theme

Generated using TypeDoc