首页 / three.js / API 文档
MeshBasicMaterial
先看结论
基础网格材质。不参与光照计算,颜色直接来自材质与贴图, 性能最好,也最容易得到稳定的纯色效果。
new THREE.MeshBasicMaterial(parameters)
构造参数
| 参数 | 默认 | 说明 |
|---|---|---|
color | 0xffffff | 材质颜色,会被贴图相乘 |
map | null | 颜色贴图 |
alphaMap | null | 透明通道贴图,只读绿色通道 |
aoMap | null | 环境光遮蔽贴图,需要第二套 UV |
lightMap | null | 烘焙光照贴图,需要第二套 UV |
envMap | null | 环境反射贴图 |
combine | MultiplyOperation | 环境贴图混合方式 |
reflectivity | 1 | 反射强度 |
wireframe | false | 只画三角网边线 |
vertexColors | false | 读取顶点颜色 |
side | FrontSide | DoubleSide 渲染背面,用于单面片 |
transparent | false | 透明排序 |
opacity | 1 | 透明度 |
fog | true | 是否受雾影响 |
depthTest / depthWrite | true / true | 深度测试与写入 |
示例
// 不需要光照的底面,颜色始终一致
const ground = new THREE.Mesh(
new THREE.PlaneGeometry(200, 200),
new THREE.MeshBasicMaterial({
color: 0x22303c,
transparent: true,
opacity: 0.85,
side: THREE.DoubleSide,
depthWrite: false
})
);
ground.rotation.x = -Math.PI / 2;
scene.add(ground);
与光照材质的取舍
| 材质 | 光照 | 适用 |
|---|---|---|
MeshBasicMaterial | 不参与 | 纯色标记、底面、调试辅助、UI 面片 |
MeshLambertMaterial | 逐顶点 | 低配设备上的大场景,观感偏平 |
MeshPhongMaterial | 逐像素 | 需要高光的地形、水面、金属 |
MeshStandardMaterial | 基于物理 | 需要真实感与 PBR 贴图的场景 |
MeshBasicMaterial 不受灯光影响,场景里的
DirectionalLight 对它没有任何作用。
调试光照时用了这个材质,会误以为灯没生效。
透明面片的排序
多个半透明面片重叠时,关闭 depthWrite 可以避免
前面的面片被后面的挡住,但会带来顺序依赖。
贴地标线、热力面这类始终贴在另一个表面上的元素,
还要配合 polygonOffset 或
renderOrder 防止 z-fighting。
贴图会被颜色相乘。color 为深色时,
贴图整体变暗;需要贴图原色时把 color 设为 0xffffff。
这个规则适用于所有带颜色贴图的材质。
经纬志(2026)。《MeshBasicMaterial》。https://www.jingweizhi.com/three/api/mesh-basic-material.html(访问日期 2026-11-03)。