Эффект тени Three.js не такой, как в Unity 3D

Question

Я импортирую .fbx 3D-модель в свою сцену, используя three.js, и обнаружил, что эффект тени отличается от использования Unity.Все тени слишком размытые.

Как установить shadowMap в three.js таким же, как в Unity?

Вот мой код.

light = scene.getObjectByName("DirectionalLight");
light.castShadow = true;
light.shadowMap.type = THREE.PCFSoftShadowMap;
light.shadow.mapSize.width = 1024;
light.shadow.mapSize.height = 1024;

Спасибо!!

Answer 1

Ваши артефакты вызваны недостаточной точностью карты теней. Это будет хорошо видно, если вы отключите PCF, установив light.shadowMap.type = THREE.BasicShadowMap (и это также должно отключить размытость). Уменьшение размера ядра PCF уменьшит размытость, но, кажется, нет никаких ручек, чтобы настроить его в three.js.

Результат будет немного лучше, если вы увеличите разрешение карты теней (например, до 2048). Но этого было бы недостаточно для такой большой сцены.

Unity использует каскадные карты теней , а three.js использует одну карту теней для всей сцены и , что вызывает основной разрыв в качестве . Ссылка на документацию Unity . Хорошие документы MSDN о картах теней .

Если ваша сцена статична, рассмотрите возможность использования световых карт. Это также даст вам лучшую производительность.