rhodonite
    Preparing search index...

    Class CubeTexture

    A cube texture class that represents a cubemap texture for 3D rendering. Cube textures are commonly used for environment mapping, skyboxes, and reflection mapping. This class extends AbstractTexture and provides functionality to load cube textures from various sources including files, Basis compressed textures, and typed arrays.

    // Load cube texture from files
    const cubeTexture = await CubeTexture.loadFromUrl({
    baseUrl: 'path/to/cubemap',
    mipmapLevelNumber: 1,
    isNamePosNeg: true,
    hdriFormat: HdriFormat.LDR_SRGB
    });

    // Create a simple 1x1 cube texture
    const simpleCube = new CubeTexture();
    simpleCube.load1x1Texture('rgba(255,0,0,1)');

    Hierarchy (View Summary)

    Implements

    • Disposable
    Index

    Constructors

    Properties

    __canvasContext?: CanvasRenderingContext2D
    __engine: Engine
    __format: EnumIO = PixelFormat.RGBA
    __hasTransparentPixels: boolean = false
    __height: number = 0
    __htmlCanvasElement?: HTMLCanvasElement
    __htmlImageElement?: HTMLImageElement
    __img?: HTMLImageElement
    __internalFormat: TextureFormatEnum = TextureFormat.RGBA8
    __isDummyTexture: boolean = false
    __isTextureReady: boolean = false
    __level: number = 0
    __mipLevelCount: number = 1
    __name: string = 'untitled'
    __startedToLoad: boolean = false
    __type: ComponentTypeEnum = ComponentType.UnsignedByte
    __uri?: string
    __width: number = 0
    _recommendedTextureSampler?: Sampler
    _samplerResourceUid: number = -1
    _tags: RnTags = {}

    Collection of tags associated with this object

    _textureResourceUid: number = -1
    _textureViewAsRenderTargetResourceUid: number = -1
    _textureViewResourceUid: number = -1
    hdriFormat: EnumIO = HdriFormat.LDR_SRGB

    The HDRI format used for this cube texture

    mipmapLevelNumber: number = 1

    The number of mipmap levels for this cube texture

    currentMaxObjectCount: number = 0

    Current maximum object count for UID generation

    InvalidObjectUID: -1

    Invalid object UID constant

    Accessors

    • get htmlCanvasElement(): HTMLCanvasElement

      Gets or creates an HTML canvas element with the texture content. If an image element exists, it will be drawn onto the canvas.

      Returns HTMLCanvasElement

      The HTML canvas element containing the texture data

    • get htmlImageElement(): HTMLImageElement | undefined

      Gets the HTML image element associated with this texture.

      Returns HTMLImageElement | undefined

      The HTML image element or undefined if not available

    • get isDummyTexture(): boolean

      Checks whether this texture is marked as a dummy (placeholder) texture.

      Returns boolean

      True if the texture is marked as dummy, false otherwise

    • get isTextureReady(): boolean

      Checks if the texture is ready for use.

      Returns boolean

      True if the texture is ready, false otherwise

    • get isTransparent(): boolean

      Checks if the texture contains transparent pixels.

      Returns boolean

      True if the texture has transparency, false otherwise

    • get objectUID(): number

      Gets the unique object identifier

      Returns number

      The object's UID

    • get startedToLoad(): boolean

      Checks if the texture has started loading.

      Returns boolean

      True if loading has started, false otherwise

    • get uniqueName(): string

      Gets the unique name of this object

      Returns string

      The unique name string

    • get uri(): string | undefined

      Gets the URI/URL of the texture source.

      Returns string | undefined

      The texture URI or undefined if not set

    Methods

    • Implements the Disposable interface for automatic resource cleanup. This method is called when using the 'using' statement in TypeScript.

      Returns void

      using cubeTexture = new CubeTexture();
      // Texture will be automatically disposed when going out of scope
    • Creates an HTMLCanvasElement containing the texture data read from GPU. This is useful for displaying texture previews when htmlImageElement is not available. Works with both WebGL and WebGPU backends.

      Returns Promise<HTMLCanvasElement | undefined>

      Promise resolving to an HTMLCanvasElement with the texture content, or undefined if the texture is not ready or reading fails

    • Completely destroys this cube texture and releases all associated resources. This method should be called when the texture is no longer needed to prevent memory leaks. After calling destroy(), this texture instance should not be used.

      Returns void

    • Destroys the 3D API resources associated with this cube texture. This method releases the texture from GPU memory and resets the texture state. After calling this method, the texture cannot be used for rendering until reloaded.

      Returns void

    • Generates a cube texture from typed arrays containing raw image data. This method allows creating cube textures from pre-processed image data with multiple mipmap levels.

      Parameters

      • typedArrayImages: {
            negX: TypedArray;
            negY: TypedArray;
            negZ: TypedArray;
            posX: TypedArray;
            posY: TypedArray;
            posZ: TypedArray;
        }[]

        Array of typed array objects for cubemap textures. Each element represents a mipmap level (index 0 is the base level). Each object contains six faces: posX, negX, posY, negY, posZ, negZ.

      • baseLevelWidth: number

        Width of the base level texture (mipmap level 0)

      • baseLevelHeight: number

        Height of the base level texture (mipmap level 0)

      Returns void

      const cubeTexture = new CubeTexture();
      const imageData = [{
      posX: new Uint8Array(imageDataPosX),
      negX: new Uint8Array(imageDataNegX),
      posY: new Uint8Array(imageDataPosY),
      negY: new Uint8Array(imageDataNegY),
      posZ: new Uint8Array(imageDataPosZ),
      negZ: new Uint8Array(imageDataNegZ)
      }];
      cubeTexture.generateTextureFromTypedArrays(imageData, 512, 512);
    • Retrieves the pixel data from all six faces of the cube texture. This operation reads back all face data from GPU memory to CPU memory.

      Returns Promise<
          {
              negX: Uint8Array;
              negY: Uint8Array;
              negZ: Uint8Array;
              posX: Uint8Array;
              posY: Uint8Array;
              posZ: Uint8Array;
          },
      >

      A promise that resolves to an object containing Uint8Arrays for each face

      const cubeTexture = new CubeTexture(engine);
      // ... load texture ...
      const allFaces = await cubeTexture.getAllCubeFacePixelData();
      console.log(allFaces.posX); // +X face data
      console.log(allFaces.negZ); // -Z face data
    • Retrieves the pixel data from a specific face of the cube texture. This operation reads back the texture data from GPU memory to CPU memory.

      Parameters

      • faceIndex: number

        Index of the cube face (0=+X, 1=-X, 2=+Y, 3=-Y, 4=+Z, 5=-Z)

      Returns Promise<Uint8Array<ArrayBufferLike>>

      A promise that resolves to a Uint8Array containing the RGBA pixel data

      const cubeTexture = new CubeTexture(engine);
      // ... load texture ...
      const posXData = await cubeTexture.getCubeFacePixelData(0); // Get +X face
      const negYData = await cubeTexture.getCubeFacePixelData(3); // Get -Y face
    • Retrieves image data from a rectangular region of the texture. Creates an internal canvas context if one doesn't exist.

      Parameters

      • x: number

        The x-coordinate of the top-left corner

      • y: number

        The y-coordinate of the top-left corner

      • width: number

        The width of the region

      • height: number

        The height of the region

      Returns ImageData

      ImageData object containing the pixel data

    • Gets the pixel data at the specified coordinates as a raw Uint8ClampedArray. This provides direct access to the RGBA values as 8-bit integers.

      Parameters

      • x: number

        The x-coordinate of the pixel

      • y: number

        The y-coordinate of the pixel

      Returns Uint8ClampedArray

      A Uint8ClampedArray containing the RGBA pixel data

    • Retrieves a complete tag object (name and value) for the specified tag name

      Parameters

      • tagName: string

        The name of the tag to retrieve

      Returns Tag

      A Tag object containing the name and value

    • Retrieves the value associated with a specific tag name

      Parameters

      • tagName: string

        The name of the tag whose value to retrieve

      Returns any

      The tag value, or undefined if the tag doesn't exist

    • Reads the texture data from GPU and returns it as a Uint8Array. This method works with both WebGL and WebGPU backends. Useful for textures that don't have an associated htmlImageElement (e.g., dummy textures).

      Returns Promise<Uint8Array<ArrayBufferLike> | undefined>

      Promise resolving to the pixel data as a Uint8Array in RGBA format, or undefined if the texture is not ready or reading fails

    • Checks whether this object has a tag with the specified name

      Parameters

      • tagName: string

        The name of the tag to check for

      Returns boolean

      True if the tag exists (value is not null/undefined), false otherwise

    • Imports an existing WebGL texture directly into this CubeTexture instance. This method allows wrapping existing WebGL textures without creating new ones.

      Parameters

      • webGLTexture: WebGLTexture

        The existing WebGL texture object to import

      • width: number = 0

        Optional width of the texture (default: 0)

      • height: number = 0

        Optional height of the texture (default: 0)

      Returns void

      const cubeTexture = new CubeTexture();
      const existingTexture = gl.createTexture(); // Assume this is configured
      cubeTexture.importWebGLTextureDirectly(existingTexture, 512, 512);
    • Creates a simple 1x1 pixel cube texture with a solid color. This is useful for creating placeholder textures or solid color cube maps.

      Parameters

      • rgbaStr: string = 'rgba(0,0,0,1)'

        CSS color string in rgba format (default: 'rgba(0,0,0,1)' for black)

      Returns void

      const cubeTexture = new CubeTexture();
      cubeTexture.load1x1Texture('rgba(255,255,255,1)'); // White cube texture
      cubeTexture.load1x1Texture('rgba(0,128,255,1)'); // Blue cube texture
    • Loads cube texture images from files asynchronously. This method loads six cube faces from image files and creates a cube texture.

      Parameters

      • options: {
            baseUrl: string;
            hdriFormat: EnumIO;
            isNamePosNeg: boolean;
            mipmapLevelNumber: number;
        }

        Configuration options for loading the cube texture

        • baseUrl: string

          Base URL path to the cube texture files

        • hdriFormat: EnumIO

          The HDRI format to use for the texture

        • isNamePosNeg: boolean

          Whether to use positive/negative naming convention (posX, negX, etc.)

        • mipmapLevelNumber: number

          Number of mipmap levels to generate

      Returns Promise<void>

      const cubeTexture = new CubeTexture();
      await cubeTexture.loadTextureImages({
      baseUrl: 'textures/skybox',
      mipmapLevelNumber: 1,
      isNamePosNeg: true,
      hdriFormat: HdriFormat.LDR_SRGB
      });
    • Loads cube texture from Basis compressed texture data. Basis is a universal texture compression format that can be transcoded to various GPU formats.

      Parameters

      Returns void

      Will log an error if BASIS transcoder is not available

      const cubeTexture = new CubeTexture();
      const basisData = new Uint8Array(basisFileBuffer);
      cubeTexture.loadTextureImagesFromBasis(basisData, {
      magFilter: TextureParameter.Linear,
      minFilter: TextureParameter.LinearMipmapLinear
      });
    • Checks if this object has a tag with the specified name and value

      Parameters

      • tagName: string

        The tag name to match

      • tagValue: string

        The tag value to match

      Returns boolean

      True if the object has a matching tag, false otherwise

    • Checks if this object has all the specified tags with exactly matching values

      Parameters

      • tags: RnTags

        Object containing tag names as keys and expected values

      Returns boolean

      True if all specified tags exist with matching values, false otherwise

    • Checks if the object's combined tag string contains all the provided search strings. This allows for flexible searching within tag names and values.

      Parameters

      • stringArray: string[]

        Array of strings that must all be present in the combined tag string

      Returns boolean

      True if all strings are found in the combined tag string, false otherwise

    • Sets a specific channel value for a pixel at the given coordinates. Useful for modifying individual color channels (R, G, B, A).

      Parameters

      • x: number

        The x-coordinate of the pixel

      • y: number

        The y-coordinate of the pixel

      • channelIdx: number

        The channel index (0=R, 1=G, 2=B, 3=A)

      • value: number

        The new value for the channel (0-255)

      Returns void

    • Attempts to set a tag on this object. If the tag already exists, it will be replaced.

      Parameters

      • tag: Tag

        The tag object containing the name and value to set

      Returns boolean

      True if the tag was successfully set, false if the tag name contains invalid characters

    • Attempts to set a unique name for this object

      Parameters

      • name: string

        The desired unique name

      • toAddNameIfConflict: boolean

        If true, appends UID to make name unique when conflicts occur; if false, fails on conflict

      Returns boolean

      True if the name was successfully set, false if there was a conflict and toAddNameIfConflict was false

    • Validates that a tag string contains only allowed characters (alphanumeric and underscore)

      Parameters

      • val: string

        The string to validate

      Returns boolean

      True if the string contains only valid characters, false if it contains invalid characters

    • Static factory method to create and load a cube texture from URL in one step. This is a convenience method that combines instantiation and loading.

      Parameters

      • engine: Engine
      • options: {
            baseUrl: string;
            hdriFormat: EnumIO;
            isNamePosNeg: boolean;
            mipmapLevelNumber: number;
        }

        Configuration options for loading the cube texture

        • baseUrl: string

          Base URL path to the cube texture files

        • hdriFormat: EnumIO

          The HDRI format to use for the texture

        • isNamePosNeg: boolean

          Whether to use positive/negative naming convention

        • mipmapLevelNumber: number

          Number of mipmap levels to generate

      Returns Promise<CubeTexture>

      Promise that resolves to a loaded CubeTexture instance

      const cubeTexture = await CubeTexture.loadFromUrl({
      baseUrl: 'assets/skybox/sunset',
      mipmapLevelNumber: 1,
      isNamePosNeg: true,
      hdriFormat: HdriFormat.RGBE_PNG
      });
    • Searches for the first object that has a specific tag with the given value

      Parameters

      • tag: string

        The tag name to search for

      • value: string

        The tag value to match

      Returns WeakRef<RnObject> | undefined

      WeakRef to the first matching object, or undefined if not found