three.js shadow cutoff
canvas, html, three.js, webgl
Solution
just use `THREE.SpotLight` instead.
Just put on `shadowCameraVisible = true;` to see the light and it will work. Offcourse you are required to set the position `position.set(x, y, z);`
Problem
As the title says. When i render the current scene everything works fine. Only the shadow of the white monkey gets cut off. How can this happen, and is there a resolution for it? Here is the site: http://hammer.bz/test/ and a screen ;) https://i.stack.imgur.com/6jd0h.png I guess it has to do with the camera or with the lights.. so here are they: ``` renderer.shadowMapEnabled = true; renderer.sortObjects = false; renderer.shadowMapWidth = 3072; renderer.shadowMapHeight = 3072 renderer.shadowCameraNear = 2; renderer.shadowCameraFar = 40000; renderer.shadowCameraFov = 50; renderer.shadowMapBias = -0.00022; renderer.shadowMapDarkness = 0.55; renderer.shadowMapSoft = true; renderer.physicallyBasedShading = true; renderer.setClearColorHex( 0x999999, 1 ); camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.1, 40000 ); camera.position.x = x; camera.position.y = y; camera.position.z = z; camera.rotation.x = -0.8; scene.add( camera ); var light = new THREE.DirectionalLight( 0xffffff, 1 ); light.position.set( -2, 5, 2 ).normalize(); light.shadowCameraNear = 0.01; light.shadowCameraFar = 1000000; light.castShadow = true; light.shadowDarkness = 0.5; light.shadowCameraVisible = false; scene.add( light ); ``` Thanks in advance! Bram EDIT: got it: just use `THREE.SpotLight` instead. It was a dumb question. Just put on `shadowCameraVisible = true;` to see the light and it will work. Feeling a bit dumb now for this question haha ;)