mirror of
https://github.com/visgl/luma.gl.git
synced 2025-12-08 17:36:19 +00:00
121 lines
3.7 KiB
Markdown
121 lines
3.7 KiB
Markdown
# Texture2D
|
|
|
|
> This page describes deprecated components in the legacy luma.gl v8 API.
|
|
|
|
2D textures hold basic "single image" textures (although technically they can contain multiple mipmap levels). They hold image memory of a certain format and size, determined at initialization time. They can be read from using shaders and written to by attaching them to frame buffers.
|
|
|
|
Most texture related functionality is implemented by and documented on the [Texture](/docs/api-reference/gltools/classes/texture) base class. For additional information, see [OpenGL Wiki](https://www.khronos.org/opengl/wiki/Texture).
|
|
|
|
## Usage
|
|
|
|
Construct a new texture from an image
|
|
|
|
```typescript
|
|
const texture = new Texture2D(gl, {
|
|
data: image,
|
|
parameters: {
|
|
[GL.TEXTURE_MAG_FILTER]: GL.NEAREST,
|
|
[GL.TEXTURE_MIN_FILTER]: GL.NEAREST
|
|
},
|
|
pixelStore: {
|
|
[GL.UNPACK_FLIP_Y_WEBGL]: true
|
|
},
|
|
mipmaps: true
|
|
});
|
|
```
|
|
|
|
Construct a texture initialized with a data array
|
|
|
|
```typescript
|
|
const texture = new Texture2D(gl, {
|
|
width: 2,
|
|
height: 1,
|
|
format: GL.RGB,
|
|
data: new Uint8Array([255, 0, 0, 0, 0, 255]),
|
|
parameters: {
|
|
[GL.TEXTURE_MAG_FILTER]: GL.NEAREST,
|
|
[GL.TEXTURE_MIN_FILTER]: GL.NEAREST
|
|
},
|
|
pixelStore: {
|
|
[GL.UNPACK_FLIP_Y_WEBGL]: true
|
|
},
|
|
mipmaps: true
|
|
});
|
|
```
|
|
|
|
Construct an empty 1x1 texture
|
|
|
|
```typescript
|
|
const texture = new Texture2D(gl);
|
|
```
|
|
|
|
Resize it (this clears the texture).
|
|
|
|
```typescript
|
|
texture.resize({width: 10, height: 10});
|
|
```
|
|
|
|
Write a sub image into the texture
|
|
|
|
```typescript
|
|
texture.setSubImageData({pixels, x, y, width, height, level, type, dataFormat});
|
|
```
|
|
|
|
Accessing elements
|
|
|
|
```typescript
|
|
console.log(
|
|
texture2D.width,
|
|
texture2D.height,
|
|
texture2D.format,
|
|
texture2D.type,
|
|
texture2D.getParameter(GL.TEXTURE_MAG_FILTER)
|
|
);
|
|
```
|
|
|
|
## Methods
|
|
|
|
### constructor(gl : WebGLRenderingContext, props : Object | data : any)
|
|
|
|
```
|
|
import {Texture2D} from '@luma.gl/gltools'
|
|
const texture1 = new Texture2D(gl, {
|
|
data: ...,
|
|
width: ...,
|
|
height: ...,
|
|
mipmaps: ...,
|
|
format: ...,
|
|
type: ...,
|
|
dataFormat: ...,
|
|
parameters: ...
|
|
});
|
|
```
|
|
|
|
There is also a short form where the image data (or a promise resolving to the image data) can be the second argument of the constructor:
|
|
|
|
```
|
|
import {Texture2D} from '@luma.gl/gltools';
|
|
import {loadImage} from '@loaders.gl/core';
|
|
|
|
const texture1 = new Texture2D(gl, loadImage(url));
|
|
// equivalent to
|
|
const texture1 = new Texture2D(gl, {data: loadImage(url)});
|
|
```
|
|
|
|
- `gl` (WebGLRenderingContext) - gl context
|
|
- `data`=null (\*) - If not provided (null), a solid color texture will be allocated of the specified size.
|
|
- `width`=`0` (_Number_) - The width of the texture.
|
|
- `height`=`0` (_Number_) - The height of the texture.
|
|
- `mipmaps`= - (_Boolean_) - Generates mipmaps when true.
|
|
- `format`=`GL.RGBA` (_GLenum_ ) - internal format that WebGL should use.
|
|
- `type`= (_enum_) - type of pixel data (`GL.UNSIGNED_BYTE`, `GL.FLOAT` etc). Default is autodeduced from `format`.
|
|
- `dataFormat`= (_GLenum_) - internal format that WebGL should use. Default is autodeduced from `format`.
|
|
- `parameters`=`{}` (_object_) - map of texture sampler parameters.
|
|
- `pixelStore`=`{}` (_object_) - map of pixel store parameters (controls how `data` is interpreted when Textures are initialized from memory)
|
|
|
|
Notes:
|
|
|
|
- setting `mipmaps` to true when `format` set to `RGB32F` will fail, even though `RGB32F` is supported texture format (with EXT_color_buffer_float), it is not supported as renderable format.
|
|
|
|
Note that since many of the constructor parameters are common to all the `Texture` classes they are detailed in [`Texture`](/docs/api-reference/gltools/classes/texture). Pixel store parameters are specified in [State Management](/docs/api-reference/gltools/context/parameter-setting)
|