分离模型

index.html

@@ -13,6 +13,8 @@
 </style>
 <script type="module">
     import * as THREE from 'three';
+    import { CSGHexNutGeometry } from './objects/育苗盘.js';
+    import { 六角螺丝帽 } from './objects/螺丝帽.js';
 
     // 1. 初始化场景、相机和渲染器
     const scene = new THREE.Scene();
@@ -21,21 +23,23 @@
     renderer.setSize(window.innerWidth, window.innerHeight);
     document.body.appendChild(renderer.domElement);
 
-    // 2. 添加立方体(立方体:红色，中等粗糙度，高金属感)
-    const cube = new THREE.Mesh(
-        new THREE.BoxGeometry(1, 1, 1),
-        new THREE.MeshStandardMaterial({ color: 0xff0000, roughness: 0.5, metalness: 0.8 })
-    );
-    scene.add(cube);
+    //// 2. 添加立方体(立方体:红色，中等粗糙度，高金属感)
+    //const cube = new THREE.Mesh(
+    //    new THREE.BoxGeometry(1, 1, 1),
+    //    new THREE.MeshStandardMaterial({ color: 0xff0000, roughness: 0.5, metalness: 0.8 })
+    //);
+    //scene.add(cube);
 
-    // 添加地面(平面:红色，中等粗糙度，高金属感)
-    const plane = new THREE.Mesh(
-        new THREE.PlaneGeometry(10, 10),
-        new THREE.MeshStandardMaterial({ color: 0x808080, roughness: 0.5, metalness: 0.8 })
+    //// 添加育苗盘
+    //const 育苗盘模型 = 育苗盘();
+    //scene.add(育苗盘模型);
+
+    // 添加螺丝帽
+    const 螺丝帽模型 = new THREE.Mesh(
+        new 六角螺丝帽(1, 0.5, 0.6),
+        new THREE.MeshStandardMaterial({ color: 0x00ff00, roughness: 0.5, metalness: 0.8 })
     );
-    plane.rotation.x = -Math.PI / 2; // 旋转地面，使其水平
-    plane.position.y = -1;           // 将地面放置在立方体下方
-    scene.add(plane);
+    scene.add(螺丝帽模型);
 
     // 添加光源
     scene.add(new THREE.AmbientLight(0x404040, 1)); // 环境光，柔和的白光
@@ -48,8 +52,17 @@
     // 3. 动画循环
     function animate() {
         requestAnimationFrame(animate);
-        cube.rotation.x += 0.01;
-        cube.rotation.y += 0.01;
+        //cube.rotation.x += 0.01;
+        //cube.rotation.y += 0.01;
+
+        //// 旋转育苗盘
+        //育苗盘模型.rotation.x += 0.01;
+        //育苗盘模型.rotation.y += 0.01;
+
+        // 旋转螺丝帽
+        螺丝帽模型.rotation.x += 0.01;
+        螺丝帽模型.rotation.y += 0.01;
+
         renderer.render(scene, camera);
     }
     animate();