【Three.js】Three.js中的纹理—图像应用和属性调整

// 假设已经有一个Three.js场景(scene)和相机(camera)
 
// 创建一个几何体，例如一个立方体
var geometry = new THREE.BoxGeometry(1, 1, 1);
 
// 加载纹理
var textureLoader = new THREE.TextureLoader();
var texture = textureLoader.load('path/to/your/texture.jpg');
 
// 创建材质并将纹理应用上去
var material = new THREE.MeshBasicMaterial({ map: texture });
 
// 根据几何体和材质创建网格
var mesh = new THREE.Mesh(geometry, material);
 
// 将网格添加到场景中
scene.add(mesh);
 
// 渲染场景
renderer.render(scene, camera);
 
// 在这里可以调整纹理的属性，例如重复方式和偏移
// 例如，设置纹理的重复方式为y轴方向
texture.repeat.set(1, 8);
// 设置纹理的偏移
texture.offset.set(0, 0.2);
 
// 更新材质属性
material.needsUpdate = true;
 
// 渲染场景
renderer.render(scene, camera);

这段代码展示了如何在Three.js中加载纹理并将其应用到几何体上。同时，演示了如何调整纹理的属性，比如重复方式和偏移，以及在调整后如何更新材质以确保变化被正确应用。