Можно ли загрузить файл .obj с цветами, если у меня нет .mtl?

Я новичок в three.js, и я столкнулся с этой проблемой. Я сделал 3D-сканирование своего лица, и он дал мне только файл .obj. Если я открою этот файл в Meshlab, модель будет окрашена. Но после того, как я загружаю его на three.js, он без текстуры.

            
    
            // Loader 
            
            const loader = new OBJLoader();

            loader.load( './models/scene.obj', 
            function ( OBJ ) {
            
            var boundingBox = new THREE.Box3().setFromObject( OBJ );
            boundingBox.getCenter( OBJ.position ).negate();
            
                scene.add( OBJ );
                
            },
            
            

            function ( xhr ) {

                console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );

            },
            

    function ( error ) {

        console.log( 'An error happened' );

    }
);

Вот так моя 3D-модель выглядит на three.js

тоже однобоко с изнаночной стороны

Также пробовал это решение, но оно не работает. "Произошла ошибка" появляется без объяснения причин

objLoader.load('assets/faceimage9.obj', function(object) {
  scene.add(object);
  object.traverse(node => {
    if (node.material) {
      node.material.vertexColors = true;
    }
  });
});

Спасибо за ваши ответы!

Редактировать: мой .obj сначала выглядит примерно как 50000 строк Можно ли загрузить файл .obj с цветами, если у меня нет .mtl? а потом лайк Можно ли загрузить файл .obj с цветами, если у меня нет .mtl?

Вот полный .obj https://drive.google.com/drive/folders/1x9MaZVWHTa-wSDkv8xzdRKU-ASPuJLOw?usp=sharing

Не могли бы вы поделиться одним из ваших OBJ в этой теме?

Mugen87 07.04.2022 10:18

Я получаю сообщение об ошибке, когда пытаюсь вставить полный .obj «Произошла ошибка при отправке редактирования». Если этого недостаточно, я могу попытаться снова вставить полный файл.

TMAC 07.04.2022 11:00

Скриншоты необработанных данных OBJ бесполезны. Подумайте о том, чтобы загрузить актив на что-то вроде Google Диска и поделиться ссылкой.

Mugen87 07.04.2022 11:45

Я загрузил гугл диск ниже скриншоты.

TMAC 07.04.2022 12:24
Получение данных из формы с помощью JavaScript - краткое руководство
Получение данных из формы с помощью JavaScript - краткое руководство
Получить данные из формы с помощью JS очень просто: вы запрашиваете элемент формы, передаете его конструктору new FormData() и, наконец, получаете...
Формы c голосовым вводом в React с помощью Speechly
Формы c голосовым вводом в React с помощью Speechly
Пытались ли вы когда-нибудь заполнить веб-форму в области электронной коммерции, которая требует много кликов и выбора? Вас попросят заполнить дату,...
В чем разница между Promise и Observable?
В чем разница между Promise и Observable?
Разберитесь в этом вопросе, и вы значительно повысите уровень своей компетенции.
Сравнение структур данных: Массивы и объекты в Javascript
Сравнение структур данных: Массивы и объекты в Javascript
Итак, вы изучили основы JavaScript и хотите перейти к изучению структур данных. Мотивация для изучения/понимания Структур данных может быть разной,...
Создание собственной системы электронной коммерции на базе Keystone.js - настройка среды и базовые модели
Создание собственной системы электронной коммерции на базе Keystone.js - настройка среды и базовые модели
Прошлая статья была первой из цикла статей о создании системы электронной коммерции с использованием Keystone.js, и она была посвящена главным образом...
Приложение для отслеживания бюджета на React js для начинающих
Приложение для отслеживания бюджета на React js для начинающих
Обучение на практике - это проверенная тема для достижения успеха в любой области. Если вы знаете контекст фразы "Практика делает человека...
3
4
46
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Ресурс OBJ определяет цвета вершин в диапазоне [0,255], который не поддерживается THREE.OBJLoader. Цветовые данные должны быть определены в нормализованном диапазоне [0,1]. К сожалению, в спецификации OBJ не упоминаются цвета вершин, поэтому приложения не всегда экспортируют такие данные.

Простое исправление для улучшения рендеринга вашего актива в three.js заключается в следующем:

objLoader.load('assets/faceimage9.obj', function(object) {
  scene.add(object);
  object.traverse(node => {
    if (node.material) {
      node.material.side = THREE.BackSide;
    }
  });
});

Таким образом, грани должны отображаться корректно (но без цветов вершин).

Другие вопросы по теме