The createTexture()
method of the GPUDevice
interface creates a GPUTexture
in which to store 1D, 2D, or 3D arrays of data, such as images, to use in GPU rendering operations.
createTexture(descriptor)
A GPUTexture
object instance.
The following criteria must be met when calling createTexture()
, otherwise a GPUValidationError
is generated and an invalid GPUTexture
object is returned:
- A valid
usage
is specified. - The values specified in
size
(width, height, or depth/array layer count) are greater than 0. -
mipLevelCount
is greater than 0. -
sampleCount
is equal to 1 or 4. - If
dimension
is set to "1d"
: - If
dimension
is set to "2d"
: - The
size
width and height values are less than or equal to the GPUDevice
's maxTextureDimension2D
limit. - The
size
depth/array layer count value is less than or equal to the GPUDevice
's maxTextureArrayLayers
limit.
- If
dimension
is set to "3d"
: - The
size
width value is a multiple of the texel block width. - The
size
height value is a multiple of the texel block height. - If
sampleCount
is greater than 1: -
mipLevelCount
is equal to 1. - The
size
depth/array layer count value is equal to 1. -
usage
includes the GPUTextureUsage.RENDER_ATTACHMENT
flag. -
usage
does not include the GPUTextureUsage.STORAGE_BINDING
flag. - The specified format supports multi-sampling.
- The
mipLevelCount
value is less than or equal to the maximum miplevel count. - The formats specified in
format
and viewFormats
are compatible with one another. - If
usage
includes the GPUTextureUsage.RENDER_ATTACHMENT
flag: -
format
is a renderable format (meaning a color renderable format, or a depth-or-stencil format). -
dimension
is set to "2d"
.
- If
usage
includes the GPUTextureUsage.STORAGE_BINDING
flag: - The specified
format
includes the STORAGE_BINDING
capability (see the Plain color formats table for reference).
In the WebGPU samples Textured Cube sample, a texture to use on the faces of a cube is created by:
let cubeTexture: GPUTexture;
{
const img = document.createElement("img");
img.src = new URL(
"../../../assets/img/Di-3d.png",
import.meta.url
).toString();
await img.decode();
const imageBitmap = await createImageBitmap(img);
cubeTexture = device.createTexture({
size: [imageBitmap.width, imageBitmap.height, 1],
format: "rgba8unorm",
usage:
GPUTextureUsage.TEXTURE_BINDING |
GPUTextureUsage.COPY_DST |
GPUTextureUsage.RENDER_ATTACHMENT,
});
device.queue.copyExternalImageToTexture(
{ source: imageBitmap },
{ texture: cubeTexture },
[imageBitmap.width, imageBitmap.height]
);
}