mirror of
https://github.com/galacean/engine.git
synced 2026-07-02 04:44:56 +08:00
72 lines
3.6 KiB
Plaintext
72 lines
3.6 KiB
Plaintext
---
|
||
order: 0
|
||
title: 纹理总览
|
||
type: 图形
|
||
group: 纹理
|
||
label: Graphics/Texture
|
||
---
|
||
|
||
纹理是 3D 渲染中最常用的资源之一。通过纹理，我们可以为模型的每个片元设置颜色值，从而实现更加丰富的美术效果，主要作用包括：
|
||
|
||
- 材质属性：纹理可以用来定义物体的材质属性，比如基础颜色和图案、光泽度、金属感和粗糙度等。
|
||
- 环境效果：实现[天空盒](/docs/graphics/background/sky/)、环境反射等特效。
|
||
|
||
Galacean 引擎支持所有 WebGL 标准的纹理，纹理可以来源于图片、canvas 画布、原始数据、视频等。
|
||
|
||
## 类型
|
||
|
||
| 类型 | 描述 |
|
||
| :--------------------------------------- | :----------------------------------------------------------------- |
|
||
| [2D 纹理](/docs/graphics/texture/2d/) | 最常用的美术资源，使用二维 UV 坐标进行采样 |
|
||
| [立方纹理](/docs/graphics/texture/cube/) | 6 张 2D 纹理组成了一个立方纹理，可以用来实现天空盒、环境反射等特效 |
|
||
| [2D 纹理数组](/apis/core/#Texture2DArray) | 只占用一个纹理单元，非常适合用来实现需要切换纹理图集的需求 |
|
||
|
||
## 属性
|
||
|
||
<Image src ="https://gw.alipayobjects.com/zos/OasisHub/c4945cc8-8cba-48a7-85ae-f6f2903fcfe1/image-20250529143945756.png" />
|
||
|
||
### sRGB
|
||
决定该纹理数据是否是 sRGB 颜色空间，默认为 `true`，如果是法线纹理等线性数据，我们需要关闭该开关，更多详情可以查看[色彩空间](/docs/core/color/)。
|
||
|
||
### mipmap
|
||
|
||
**引擎默认开启 [mipmap](/apis/core/#Texture-generateMipmaps)**，用于在低分辨率屏幕中采样高分辨率纹理时提高性能和精度。WebGL2.0 支持任意分辨率的纹理，但 WebGL1.0 环境下需要上传 **2 次幂纹理**（如 1024x512），否则会自动关闭 mipmap。
|
||
|
||
<Image src="https://gw.alipayobjects.com/mdn/rms_d27172/afts/img/A*mTBvTJ7Czt4AAAAAAAAAAAAAARQnAQ" />
|
||
|
||
|
||
### 过滤模式
|
||
|
||
纹素和屏幕像素通常不会完全对应，可以通过过滤模式控制放大（Mag）和缩小（Min）时的采样方式：
|
||
|
||
| 采样过滤模式 | 描述 |
|
||
| :----------- | :----------------------------------------------------- |
|
||
| Point | 使用距离采样点最近的纹素 |
|
||
| Bilinear | 使用距离最近的 2\*2 纹素矩阵的平均值 |
|
||
| Trilinear | 在双线性过滤的基础上，对 mipmap 层级也进行了平均值过滤 |
|
||
|
||
|
||
### 循环模式
|
||
|
||
纹理采样的范围为 `[0,1]`，当 UV 坐标超出范围时，可以通过循环模式控制采样方式：
|
||
|
||
| 采样循环模式 | 描述 |
|
||
| :----------- | :---------------------------- |
|
||
| Clamp | 超出范围采样边缘纹素 |
|
||
| Repeat | 超出范围从 [0,1] 开始重新采样 |
|
||
| Mirror | 超出范围从 [1,0] 开始镜像采样 |
|
||
|
||
|
||
|
||
### 各向异性过滤等级
|
||
|
||
各向异性过滤技术可以使纹理在倾斜角度下观看会更加清晰。1 ~ 16 ,具体要看设备支持情况。
|
||
|
||
### 色彩膨胀
|
||
为了解决带透明像素图片在 Alpha 值突变处出现黑边的问题，编辑器内置了色彩膨胀功能。该功能是通过将图片中所有透明像素的 RGB 值改写为与其最临近非完全透明像素的 RGB 值，达到去除图片黑边的效果。
|
||
|
||
### 纹理压缩
|
||
|
||
通过压缩纹理可以有效降低显存和提升图片解码速度，详情查看[纹理压缩](/docs/graphics/texture/compression/)。
|
||
|