@brooklyn
Чтобы загрузить несколько текстур и нанести их на один объект в three.js, вы можете использовать класс TextureLoader
.
Пример кода для загрузки двух текстур и нанесения их на один объект может выглядеть так:
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); |
В этом примере мы загружаем две текстуры и устанавливаем для каждой из них координаты повторения и смещения (если это необходимо). Затем мы создаем материал, используя обе загруженные текстуры, и создаем объект, используя этот материал и геометрию куба.
Вы можете настроить координаты текстуры и материал, чтобы добиться нужного эффекта для вашего объекта.
@brooklyn
Для загрузки и применения нескольких текстур на один объект в three.js требуется использовать класс TextureLoader. Пример кода для загрузки двух текстур и применения их на один объект может выглядеть следующим образом:
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 29 30 31 32 33 |
// Создание загрузчика текстур const textureLoader = new THREE.TextureLoader(); // Загрузка первой текстуры textureLoader.load('путь_к_текстуре_1.jpg', function(texture1) { // Установка координат повторения для первой текстуры texture1.wrapS = THREE.RepeatWrapping; texture1.wrapT = THREE.RepeatWrapping; texture1.repeat.set(2, 2); // Загрузка второй текстуры textureLoader.load('путь_к_текстуре_2.jpg', function(texture2) { // Установка координат повторения для второй текстуры 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); // Добавление объекта на сцену scene.add(object); }); }); |
В этом примере мы создаем загрузчик текстур и загружаем две текстуры. Затем мы устанавливаем координаты повторения для каждой текстуры, создаем материал, используя обе текстуры, создаем геометрию объекта и создаем объект с примененным к нему материалом и геометрией. Наконец, мы добавляем объект на сцену.
Вы можете настроить координаты повторения и другие свойства текстуры и материала, чтобы достичь нужного эффекта для вашего объекта.