From c24c4e5b6469c0239e60d91236cd605fb445466c Mon Sep 17 00:00:00 2001
From: zhangshun <453905631@qq.com>
Date: Tue, 16 Jun 2026 11:58:10 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E5=9B=9B=E8=BF=9E=E6=9D=86?=
 =?UTF-8?q?=E4=B8=89=E7=BB=B4=E8=A7=86=E5=9B=BE=E4=B8=BAZ=E8=BD=B4?=
 =?UTF-8?q?=E5=90=91=E4=B8=8A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/fourbar_test.html | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/public/fourbar_test.html b/public/fourbar_test.html
index 244256f..ffd7866 100644
--- a/public/fourbar_test.html
+++ b/public/fourbar_test.html
@@ -1038,6 +1038,7 @@
         scene.background = new THREE.Color(0x0f1720);
 
         const camera = new THREE.PerspectiveCamera(45, 1, 0.01, 100);
+        camera.up.set(0, 0, 1);
         const renderer = new THREE.WebGLRenderer({ antialias: true, alpha: false });
         renderer.setPixelRatio(Math.min(window.devicePixelRatio || 1, 2));
         renderer.outputColorSpace = THREE.SRGBColorSpace;
@@ -1057,7 +1058,8 @@
         scene.add(ambient, keyLight);
 
         const grid = new THREE.GridHelper(8, 32, 0x46606f, 0x263744);
-        grid.position.y = -0.08;
+        grid.rotation.x = Math.PI / 2;
+        grid.position.z = -0.08;
         scene.add(grid);
 
         const group = new THREE.Group();
@@ -1116,9 +1118,9 @@
         return new THREE.Mesh(new THREE.SphereGeometry(radius, 24, 16), material);
       }
 
-      // 把二维接口点映射到 Three.js 的 XZ 平面。
+      // 把二维接口点映射到 Three.js 的 XY 平面，保持 Z 轴为三维相机上方向。
       function toThreePoint(point) {
-        return new THREE.Vector3(point.x, 0, point.y);
+        return new THREE.Vector3(point.x, point.y, 0);
       }
 
       // 更新圆柱连杆的位置、长度和朝向。
@@ -1141,8 +1143,9 @@
       function resetThreeCamera(input = readInput()) {
         const view = ensureThreeView();
         const span = Math.max(input.L_AB + input.L_BS + input.L3 + input.L4 * 0.35, Math.abs(input.S_OFS) + input.L_AB, 1);
-        const target = new THREE.Vector3(span * 0.35, 0, input.S_OFS * 0.5);
-        view.camera.position.set(span * 0.9, span * 1.45, span * 1.75);
+        const target = new THREE.Vector3(span * 0.35, input.S_OFS * 0.5, 0);
+        view.camera.up.set(0, 0, 1);
+        view.camera.position.set(span * 0.9, span * -1.45, span * 1.75);
         view.camera.lookAt(target);
         view.controls.target.copy(target);
         view.controls.update();
@@ -1273,7 +1276,7 @@
             { x: railRange.maxX, y: input.S_OFS },
           );
           view.objects.slider.position.copy(toThreePoint(normalized.output));
-          view.objects.slider.position.y = 0.02;
+          view.objects.slider.position.z = 0.02;
         }
 
         const joints = [view.objects.pointA, view.objects.pointB, view.objects.pointC, view.objects.pointD];