Как загрузить несколько текстур в разные координаты на один объект в three.js?

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

// Создаем загрузчик текстур
const textureLoader = new THREE.TextureLoader();

// Загружаем первую текстуру
const texture1 = textureLoader.load('path/to/texture1.jpg');
// Устанавливаем координаты текстуры
texture1.wrapS = THREE.RepeatWrapping;
texture1.wrapT = THREE.RepeatWrapping;
texture1.repeat.set( 2, 2 );

// Загружаем вторую текстуру
const texture2 = textureLoader.load('path/to/texture2.jpg');
// Устанавливаем координаты текстуры
texture2.wrapS = THREE.RepeatWrapping;
texture2.wrapT = THREE.RepeatWrapping;
texture2.repeat.set( 2, 2 );

// Создаем материал, используя две текстуры
const material = new THREE.MeshPhongMaterial({
    map: texture1,  // первая текстура
    specularMap: texture2  // вторая текстура
});

// Создаем геометрию объекта
const geometry = new THREE.BoxGeometry(1, 1, 1);

// Создаем объект с материалом и геометрией
const object = new THREE.Mesh(geometry, material);