fixes shadow acne issue caused by the lack of normalBias adjustments …

…on the scene

example/web-client/src/Sun.ts

@@ -1,9 +1,11 @@
-import { DirectionalLight, Group, OrthographicCamera, Vector3 } from "three";
+import { CameraHelper, DirectionalLight, Group, OrthographicCamera, Vector3 } from "three";
 
 export class Sun extends Group {
+  private readonly debug: boolean = false;
   private readonly sunOffset: Vector3 = new Vector3(50, 80, 35);
-  private readonly shadowResolution: number = 16384;
-  private readonly shadowCamFrustum: number = 150;
+  private readonly shadowResolution: number = 8192;
+  private readonly shadowCamFrustum: number = 50;
+  private readonly camHelper: CameraHelper | null = null;
 
   private readonly shadowCamera: OrthographicCamera;
   private readonly directionalLight: DirectionalLight;
@@ -17,17 +19,25 @@ export class Sun extends Group {
       this.shadowCamFrustum,
       this.shadowCamFrustum,
       -this.shadowCamFrustum,
-      0.5,
-      500,
+      0.1,
+      200,
     );
-    this.directionalLight = new DirectionalLight(0xffffff, 0.8);
+    if (this.debug === true) {
+      this.camHelper = new CameraHelper(this.shadowCamera);
+    }
+    this.directionalLight = new DirectionalLight(0xffffff, 0.5);
+    this.directionalLight.shadow.normalBias = 0.05;
+    this.directionalLight.shadow.radius = 1.5;
     this.directionalLight.shadow.camera = this.shadowCamera;
     this.directionalLight.shadow.mapSize.set(this.shadowResolution, this.shadowResolution);
     this.directionalLight.castShadow = true;
 
     this.updateCharacterPosition(new Vector3(0, 0, 0));
 
     this.add(this.directionalLight);
+    if (this.debug === true && this.camHelper instanceof CameraHelper) {
+      this.add(this.camHelper);
+    }
   }
 
   public updateCharacterPosition(position: Vector3 | undefined) {

example/web-client/src/index.ts

@@ -40,7 +40,7 @@ export class App {
 
   constructor() {
     this.scene = new Scene();
-    this.scene.fog = new Fog(0xc7cad0, 30, 150);
+    this.scene.fog = new Fog(0xc7cad0, 30, 210);
     this.collisionsManager = new CollisionsManager(this.scene);
 
     this.audioListener = new AudioListener();