Optimize model loading 3
authorLanius Trolling <lanius@laniustrolling.dev>
Fri, 24 Feb 2023 17:32:31 +0000 (12:32 -0500)
committerLanius Trolling <lanius@laniustrolling.dev>
Fri, 24 Feb 2023 17:32:31 +0000 (12:32 -0500)
src/main/resources/static/init.js

index b6d8673a4cf41693f77219e993d4b24ad0893bbd..6b3f6cd4bcde52eb17ed8d48dc0791007efef68c 100644 (file)
                        if (modelName == null || modelName === "") continue;
 
                        (async () => {
-                               let threeData = {};
+                               const modelAsync = loadObj(modelName);
 
-                               let modelAsync = loadObj(modelName);
+                               const camera = new THREE.PerspectiveCamera(69, 1, 0.01, 1000.0);
 
-                               threeData.camera = new THREE.PerspectiveCamera(69, 1, 0.01, 1000.0);
+                               const scene = new THREE.Scene();
+                               scene.add(new THREE.AmbientLight("#555555", 1.0));
 
-                               threeData.scene = new THREE.Scene();
-                               threeData.scene.add(new THREE.AmbientLight("#555555", 1.0));
+                               const renderer = new THREE.WebGLRenderer({"canvas": canvas, "antialias": true});
 
-                               threeData.renderer = new THREE.WebGLRenderer({"canvas": canvas, "antialias": true});
-
-                               threeData.controls = new THREE.OrbitControls(threeData.camera, canvas);
+                               const controls = new THREE.OrbitControls(camera, canvas);
 
                                function render() {
-                                       threeData.controls.update();
-                                       threeData.renderer.render(threeData.scene, threeData.camera);
+                                       controls.update();
+                                       renderer.render(scene, camera);
                                        window.requestAnimationFrame(render);
                                }
 
                                function onResize() {
                                        const dim = canvas.getBoundingClientRect();
-                                       threeData.camera.aspect = dim.width / dim.height;
-                                       threeData.camera.updateProjectionMatrix();
-                                       threeData.renderer.setSize(dim.width, dim.height, false);
+                                       camera.aspect = dim.width / dim.height;
+                                       camera.updateProjectionMatrix();
+                                       renderer.setSize(dim.width, dim.height, false);
                                }
 
                                window.addEventListener('resize', onResize);
                                onResize();
 
                                const model = await modelAsync;
-                               threeData.scene.add(model);
+                               scene.add(model);
 
-                               const bbox = new THREE.Box3().setFromObject(threeData.scene);
+                               const bbox = new THREE.Box3().setFromObject(scene);
                                bbox.dimensions = {
                                        x: bbox.max.x - bbox.min.x,
                                        y: bbox.max.y - bbox.min.y,
                                };
                                model.position.sub(new THREE.Vector3(bbox.min.x + bbox.dimensions.x / 2, bbox.min.y + bbox.dimensions.y / 2, bbox.min.z + bbox.dimensions.z / 2));
 
-                               threeData.camera.position.set(bbox.dimensions.x / 2, bbox.dimensions.y / 2, Math.max(bbox.dimensions.x, bbox.dimensions.y, bbox.dimensions.z));
+                               camera.position.set(bbox.dimensions.x / 2, bbox.dimensions.y / 2, Math.max(bbox.dimensions.x, bbox.dimensions.y, bbox.dimensions.z));
 
-                               threeData.light = new THREE.PointLight("#AAAAAA", 1.0);
-                               threeData.scene.add(threeData.camera);
-                               threeData.camera.add(threeData.light);
-                               threeData.light.position.set(0, 0, 0);
+                               const light = new THREE.PointLight("#AAAAAA", 1.0);
+                               scene.add(camera);
+                               camera.add(light);
+                               light.position.set(0, 0, 0);
 
                                render();
                        })().catch(reason => {