Options
All
  • Public
  • Public/Protected
  • All
Menu

Interface CubeTextureLoader

Class for loading a CubeTexture. This uses the ImageLoader internally for loading files.

Code Example

 
const scene = new THREE.Scene();
scene.background = new THREE.CubeTextureLoader().setPath( 'textures/cubeMaps/' )
    .load( [
        'px.png',
        'nx.png',
        'py.png',
        'ny.png',
        'pz.png',
        'nz.png'
    ]);

Examples

materials / cubemap | materials / cubemap / dynamic | materials / cubemap / refraction

Hierarchy

Index

Constructors

Properties

Methods

Constructors

constructor

Properties

crossOrigin

crossOrigin: string

The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS. Default is anonymous.

default

'anonymous'

manager

manager: I3JS.LoadingManager

The loadingManager the loader is using. Default is DefaultLoadingManager.

path

path: string

The base path from which the asset will be loaded. Default is the empty string.

default

''

requestHeader

requestHeader: {}

The request header used in HTTP request. See .setRequestHeader. Default is empty object.

default

{}

Type declaration

  • [header: string]: string

resourcePath

resourcePath: string

The base path from which additional resources like textures will be loaded. Default is the empty string.

default

''

withCredentials

withCredentials: boolean

Whether the XMLHttpRequest uses credentials. See .setWithCredentials. Default is false.

default:

false

Methods

load

  • load(urls: string[], onLoad?: (texture: I3JS.CubeTexture) => void, onProgress?: (event: ProgressEvent<EventTarget>) => void, onError?: (event: ErrorEvent) => void): I3JS.CubeTexture

  • Begin loading from url and pass the loaded texture to onLoad. The urls should be specified in the following order: pos-x, neg-x, pos-y, neg-y, pos-z, neg-z. They can also be Data URIs. Note that, by convention, cube maps are specified in a coordinate system in which positive-x is to the right when looking up the positive-z axis -- in other words, using a left-handed coordinate system. Since three.js uses a right-handed coordinate system, environment maps used in three.js will have pos-x and neg-x swapped.

    Parameters

    • urls: string[]

      array of 6 urls to images, one for each side of the CubeTexture.

    • Optional onLoad: (texture: I3JS.CubeTexture) => void

      Will be called when load completes. The argument will be the loaded texture.

    • Optional onProgress: (event: ProgressEvent<EventTarget>) => void

      Will be called while load progresses. The argument will be the XMLHttpRequest instance, which contains .total and .loaded bytes. If the server does not set the Content-Length header; .total will be 0.

        • (event: ProgressEvent<EventTarget>): void

        • Parameters

          • event: ProgressEvent<EventTarget>

          Returns void

    • Optional onError: (event: ErrorEvent) => void

      Will be called when load errors.

        • (event: ErrorEvent): void

        • Parameters

          • event: ErrorEvent

          Returns void

    Returns I3JS.CubeTexture

loadAsync

  • loadAsync(url: string, onProgress?: (event: ProgressEvent<EventTarget>) => void): Promise<I3JS.CubeTexture>

  • Begin loading from url and pass the loaded texture to onLoad. The urls should be specified in the following order: pos-x, neg-x, pos-y, neg-y, pos-z, neg-z. They can also be Data URIs. Note that, by convention, cube maps are specified in a coordinate system in which positive-x is to the right when looking up the positive-z axis -- in other words, using a left-handed coordinate system. Since three.js uses a right-handed coordinate system, environment maps used in three.js will have pos-x and neg-x swapped.

    Parameters

    • url: string
    • Optional onProgress: (event: ProgressEvent<EventTarget>) => void

      Will be called while load progresses. The argument will be the XMLHttpRequest instance, which contains .total and .loaded bytes. If the server does not set the Content-Length header; .total will be 0.

        • (event: ProgressEvent<EventTarget>): void

        • Parameters

          • event: ProgressEvent<EventTarget>

          Returns void

    Returns Promise<I3JS.CubeTexture>

setCrossOrigin

setPath

setRequestHeader

setResourcePath

setWithCredentials

Generated using TypeDoc