Three.js 纹理贴图 - 环境贴图 - 纹理贴图 - 透明贴图 - 高光贴图

在Three.js中，创建材质并将其应用于几何体对象时，可以使用不同类型的贴图，包括环境贴图、透明贴图和高光贴图。以下是如何为材质设置这些贴图的示例代码：

// 假设已经有一个Three.js场景(scene)和相机(camera)
// 创建几何体，这里以BoxGeometry为例
var geometry = new THREE.BoxGeometry();
 
// 创建材质
var material = new THREE.MeshPhongMaterial({
    color: 0xffffff, // 基本颜色
    specular: 0xffffff, // 高光颜色
    shininess: 30, // 高光强度
    envMap: reflectionCubeTexture, // 环境贴图
    map: diffuseTexture, // 材质贴图
    transparent: true, // 透明度映射
    alphaMap: alphaTexture, // 透明度贴图
    reflectivity: 0.75, // 环境贴图强度
    // ... 其他材质参数
});
 
// 创建网格对象
var mesh = new THREE.Mesh(geometry, material);
 
// 将网格添加到场景
scene.add(mesh);
 
// 创建CubeCamera作为环境贴图
var reflectionCube = new THREE.CubeCamera(1, 100000, 256);
scene.add(reflectionCube);
 
// 在渲染循环中更新CubeCamera位置
reflectionCube.update(renderer, scene);
 
// 渲染场景
renderer.render(scene, camera);

在这个例子中，我们创建了一个MeshPhongMaterial材质，并为它设置了环境贴图（envMap）、材质贴图（map）、透明度贴图（alphaMap）。这些贴图可以是2D纹理，也可以是CubeTexture用于环境贴图。然后，我们将创建的网格对象添加到场景中，并在渲染循环中更新CubeCamera以实现环境映射效果。最后，我们渲染场景。