Class Texture

This is the main class used to create and handle GPUTexture | textures that can be used with ComputePass and/or Mesh. Also used as copy source/destination for RenderPass and RenderTarget.

Basically useful for any kind of textures: for external sources (however in some cases, DOMTexture might be preferred), depth, storages or to copy anything outputted to the screen at one point or another.

Will create a GPUTexture and its associated TextureBinding.

Example

// set our main GPUCurtains instance
const gpuCurtains = new GPUCurtains({
  container: '#canvas' // selector of our WebGPU canvas container
})

// set the GPU device
// note this is asynchronous
await gpuCurtains.setDevice()

// create a texture
const texture = new Texture(gpuCurtains, {
  label: 'My texture',
  name: 'myTexture',
})

Constructors

constructor

Properties

renderer type uuid texture size options bindings #autoResize

Accessors

textureBinding

Methods

copy copyGPUTexture createTexture uploadSource uploadData setBindings resize destroy

Constructors

constructor

Properties

renderer

renderer: Renderer

renderer used by this Texture

type

type: string

The type of the Texture

Readonly uuid

uuid: string

The universal unique id of this Texture

texture

texture: GPUTexture

The GPUTexture used

size

size: TextureSize

Size of the texture source, usually our renderer canvas size

options

options: TextureParams

Options used to create this Texture

bindings

bindings: BindGroupBindingElement[]

Array of bindings that will actually only hold one texture binding

Private #autoResize

#autoResize: boolean = true

Whether this texture should be automatically resized when the renderer size changes. Default to true.

Accessors

textureBinding

Methods

copy

copyGPUTexture

  • copyGPUTexture(texture): void

  • Copy a GPUTexture directly into this Texture. Mainly used for depth textures.

    Parameters

    • texture: GPUTexture

      GPUTexture to copy

    Returns void

createTexture

uploadSource

  • uploadSource(parameters): void

  • Upload a source to the GPU and use it for our texture.

    Parameters

    • parameters: {
          source: GPUCopyExternalImageSource;
          width?: number;
          height?: number;
          depth?: number;
          origin?: GPUOrigin3D;
          colorSpace?: PredefinedColorSpace;
      }

      parameters used to upload the source.

      • source: GPUCopyExternalImageSource

        source to use for our texture.

      • Optional width?: number

        source width.

      • Optional height?: number

        source height.

      • Optional depth?: number

        source depth.

      • Optional origin?: GPUOrigin3D

        GPUOrigin3D | origin of the source copy.

      • Optional colorSpace?: PredefinedColorSpace

    Returns void

uploadData

  • uploadData(parameters): void

  • Use data as the texture source and upload it to the GPU.

    Parameters

    • parameters: {
          width?: number;
          height?: number;
          depth?: number;
          origin?: GPUOrigin3D;
          data?: Float32Array;
      }

      parameters used to upload the source.

      • Optional width?: number

        data source width.

      • Optional height?: number

        data source height.

      • Optional depth?: number

        data source depth.

      • Optional origin?: GPUOrigin3D

        GPUOrigin3D | origin of the data source copy.

      • Optional data?: Float32Array

        Float32Array data to use as source.

    Returns void

setBindings

resize

destroy

Settings

Member Visibility

Theme

On This Page