A function that loads 6 images representing the faces of a cube. Primarily intended for loading images for WebGL GL.TEXTURE_CUBE
textures.
Load images for a cubemap with one image per face
import '@loaders.gl/polyfills'; // only needed for Node.js support
import {loadImageCube} from `@loaders.gl/images`;
const imageCube = await loadImageCube(({direction}) => `diffuse-${direction}.png`);
for (const face in imageCube) {
const image = imageCube[face];
}
Load images for a cubemap with an array of mip images per face
import '@loaders.gl/polyfills'; // only needed for Node.js support
import {loadImageCube} from `@loaders.gl/images`;
const imageCube = await loadImageCube('mips', ({direction}) => `diffuse-${direction}.png`);
for (const face in imageCube) {
const imageArray = imageCube[face];
for (const lodImage of imageArray) {
...
}
}
The following fields will be supplied as named parameters to the getUrl
function when loading cube maps:
faceIndex | face | direction | axis | sign |
---|---|---|---|---|
0 | GL.TEXTURE_CUBE_MAP_POSITIVE_X (0x8515) | 'right' | 'x' | 'positive' |
1 | GL.TEXTURE_CUBE_MAP_NEGATIVE_X (0x8516) | 'left' | 'x' | 'negative' |
2 | GL.TEXTURE_CUBE_MAP_POSITIVE_Y (0x8517) | 'top' | 'y' | 'positive' |
3 | GL.TEXTURE_CUBE_MAP_NEGATIVE_Y (0x8518) | 'bottom' | 'y' | 'negative' |
4 | GL.TEXTURE_CUBE_MAP_POSITIVE_Z (0x8519) | 'front' | 'z' | 'positive' |
5 | GL.TEXTURE_CUBE_MAP_NEGATIVE_Z (0x851a) | 'back' | 'z' | 'negative' |
Note: In addition to these values, all options
passed in to loadImageCube
are also available in the getUrl
method.
Loads and image cube, i.e. 6 images keyed by WebGL face constants (see table).
Parameters:
getUrl
: A function that generates the url for each image, it is called for each image with the index
of that image.options
: Supports the same options as ImageLoader
.Returns
Accepts the same options as ImageLoader
, and
Option | Type | Default | Description | |
---|---|---|---|---|
image.mipLevels | `Number | String` | 0 | If 'auto' or non-zero, loads an array of mip images. |
Number of mip level images to load: Use 0
to indicate a single image with no mips. Supplying the string 'auto'
will infer the mipLevel from the size of the lod
=0
image.
ImageLoader
for details about the type of the returned images.