Soft shadows from jaggered ones

I am getting harsh shadows and I’ve tried to blur it apparently its not working is there like a simple blur option which i can use to get softer shadows.


Baking is not an option for me.

the code for creating a transparent shadow receiving plane and the dlight is mentioned below.
const planegeo = new THREE.CircleGeometry(2.5,128);
const planemat = new THREE.ShadowMaterial( { opacity : .1 } );
planemat.opacity = 0.5;

//creating a circle mesh and and applying it to the geometry
const planemesh = new THREE.Mesh(planegeo, planemat);
planemesh.rotation.x = -0.5 * Math.PI;
planemesh.receiveShadow = true;
scene.add(planemesh);

//initializing the direction light and making it cast shadow
const dlight = new THREE.DirectionalLight(0xffffff, 3);
dlight.position.set(3, 6, 7);
dlight.castShadow = true;
dlight.shadow.radius = 15;
scene.add(dlight);

//softening the shadow and specifying the bouding box
dlight.shadow.mapSize.width = 1024;
dlight.shadow.mapSize.height = 1024;
dlight.shadow.camera.near = 0.5;
dlight.shadow.camera.far = 500;
dlight.shadow.radius = 3;

try
renderer.shadowMap.type = THREE.VSMShadowMap
E.g.,
Soft Shadows : https://sbcode.net/threejs/soft-shadows/
image

2 Likes
dlight.shadow.mapSize.width = 2048;
dlight.shadow.mapSize.height = 2048;

dlight.shadow.bias = 0.0001

https://threejs.org/docs/#api/en/lights/shadows/LightShadow.bias

1 Like