Загруженный OBJ в Three.js не получает тени, даже если для свойства установлено значение true

Question

В настоящее время я погружаюсь в Three.js и столкнулся с моей первой настоящей проблемой при переключении с нативных примитивов на импортированные объекты OBJ.

У меня есть простая модель додекаэдра, которую я UV-картировал в Cinema4D r15 и экспортировал как файл OBJ. При использовании этой модели поверх геометрии додекаэдра геометрия больше не освещается моим направленным светом, но это происходит, если я использую примитив.

Смотрите это JSFiddle: https://jsfiddle.net/xm3ttmxw/1/

Смотрите желаемый результат здесь (используя примитив): https://jsfiddle.net/84hbs7ed/1/

Как видите, я устанавливаю receiveShadow собственность на true для всех сеток в OBJ. Я активировал карты теней для света и рендерера. Направленный свет следует за камерой и указывает на начало координат (центр додекаэдра). Окружающий свет, кажется, работает нормально.

Любая идея? заранее спасибо

Answer 1

После еще нескольких исследований выясняется, что проблема связана с отсутствием нормалей вершин (OBJLoader их не вычисляет). Решение состоит в том, чтобы вычислить нормали вершин на лету, как показано здесь: /questions/45179517/plavnoe-zatenenie-ne-rabotaet-dlya-obj-zagruzhennogo-v-stsene-threejs/45179528#45179528

object.traverse( function( child ) {
    if ( child instanceof THREE.Mesh ) {
        child.geometry.computeVertexNormals(); //add this
    }
} );

Спасибо Себастьян Балтес!