test1

Author: LPEdwin

src/main.ts

@@ -18,7 +18,7 @@ THREE.DefaultLoadingManager.setURLModifier((url) => {
 const canvas = document.getElementById("renderCanvas") as HTMLCanvasElement;
 
 // Renderer setup
-const renderer = new THREE.WebGLRenderer({ canvas, antialias: true });
+const renderer = new THREE.WebGLRenderer({ canvas, antialias: false });
 renderer.setPixelRatio(window.devicePixelRatio);
 renderer.setSize(window.innerWidth, window.innerHeight);
 renderer.outputColorSpace = THREE.SRGBColorSpace;
@@ -29,9 +29,9 @@ renderer.shadowMap.enabled = true;
 // Scene + Background
 const scene = new THREE.Scene();
 
-const backgroundMap = await new THREE.TextureLoader().loadAsync('/hdri/rich_multi_nebulae_2k.png');
-backgroundMap.colorSpace = THREE.SRGBColorSpace;
-scene.background = (await buildPrefilteredRadianceMap(backgroundMap, renderer)).texture;
+// const backgroundMap = await new THREE.TextureLoader().loadAsync('/hdri/rich_multi_nebulae_2k.png');
+// backgroundMap.colorSpace = THREE.SRGBColorSpace;
+// scene.background = (await buildPrefilteredRadianceMap(backgroundMap, renderer)).texture;
 
 // Camera + controls
 const camera = new THREE.PerspectiveCamera(
@@ -51,9 +51,9 @@ controls.mouseButtons = {
     RIGHT: THREE.MOUSE.ROTATE
 };
 
-// Lights
-const radianceMap = await new HDRLoader().loadAsync('/hdri/kloppenheim_02_puresky_1k.hdr');
-scene.environment = (await buildPrefilteredRadianceMap(radianceMap, renderer)).texture;
+// // Lights
+// const radianceMap = await new HDRLoader().loadAsync('/hdri/kloppenheim_02_puresky_1k.hdr');
+// scene.environment = (await buildPrefilteredRadianceMap(radianceMap, renderer)).texture;
 
 const dirLight = new THREE.DirectionalLight(0xffffff, 0.8);
 dirLight.position.set(-5, 10, -5);
@@ -152,27 +152,27 @@ async function init() {
 
     scar.material = orange_mat;
 
-    // Card 
-    const tex = await new THREE.TextureLoader().loadAsync("/models/Scar_Lion_King.png");
-    tex.colorSpace = THREE.SRGBColorSpace;
-
-    const card = new THREE.Mesh(
-        new THREE.PlaneGeometry(3.34, 2.98),
-        new THREE.MeshBasicMaterial({
-            map: tex,
-            transparent: true,
-            alphaTest: 0.05,
-            side: THREE.DoubleSide,
-            depthWrite: false,   // avoid sorting artifacts
-        })
-    );
-
-    card.scale.multiplyScalar(0.4);
-    card.position.z -= 0.75;
-    card.position.y -= 0.25;
-    card.rotation.set(-Math.PI * 0.5, -Math.PI * 0.5, 0);
-
-    scar.add(card);
+    // // Card 
+    // const tex = await new THREE.TextureLoader().loadAsync("/models/Scar_Lion_King.png");
+    // tex.colorSpace = THREE.SRGBColorSpace;
+
+    // const card = new THREE.Mesh(
+    //     new THREE.PlaneGeometry(3.34, 2.98),
+    //     new THREE.MeshBasicMaterial({
+    //         map: tex,
+    //         transparent: true,
+    //         alphaTest: 0.05,
+    //         side: THREE.DoubleSide,
+    //         depthWrite: false,   // avoid sorting artifacts
+    //     })
+    // );
+
+    // card.scale.multiplyScalar(0.4);
+    // card.position.z -= 0.75;
+    // card.position.y -= 0.25;
+    // card.rotation.set(-Math.PI * 0.5, -Math.PI * 0.5, 0);
+
+    // scar.add(card);
 
     // === Interaction ===
     let currentPick: THREE.Mesh | null = null;