fix: cameras side by side, panels next to them, zoom out 3D view

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Ruslan Bakiev
2026-03-07 11:15:24 +07:00
parent 8dd1573d0e
commit dc79763dab

View File

@@ -285,13 +285,13 @@
<div class="viewport-3d" id="court-3d"></div>
<div class="bottom-bar">
<div class="cam-thumb"><img id="court-cam1" alt="Camera 1"></div>
<div class="cam-thumb"><img id="court-cam0" alt="Camera 0"></div>
<div class="sidebar-panel">
<button class="btn-calibrate" id="btnCalibrate" onclick="doCalibrate()">Calibrate Court</button>
<div class="calibrate-status" id="calStatus">
<span id="calStatusText">Not calibrated</span>
</div>
</div>
<div class="cam-thumb"><img id="court-cam0" alt="Camera 0"></div>
</div>
</div>
</div>
@@ -302,6 +302,7 @@
<div class="viewport-3d" id="trajectory-3d"></div>
<div class="bottom-bar">
<div class="cam-thumb"><img id="traj-cam1" alt="Camera 1"></div>
<div class="cam-thumb"><img id="traj-cam0" alt="Camera 0"></div>
<div class="var-panel-bottom">
<div class="var-indicator">
<div class="var-dot" id="varDot"></div>
@@ -315,7 +316,6 @@
<img class="var-snapshot" id="varSnapshot" style="display:none">
<div class="var-snapshot empty" id="varSnapshotEmpty">No snapshot</div>
</div>
<div class="cam-thumb"><img id="traj-cam0" alt="Camera 0"></div>
</div>
</div>
</div>
@@ -469,7 +469,7 @@ function initCourtScene() {
courtScene.background = new THREE.Color(0x0a0a1a);
courtCamera = new THREE.PerspectiveCamera(50, w / h, 0.1, 100);
courtCamera.position.set(7.7, 3.05, 1);
courtCamera.position.set(6.7, -6, 10);
courtCamera.lookAt(6.7, 3.05, 0);
courtRenderer = new THREE.WebGLRenderer({ antialias: true });
@@ -542,7 +542,7 @@ function initTrajectoryScene() {
trajScene.background = new THREE.Color(0x0a0a1a);
trajCamera = new THREE.PerspectiveCamera(50, w / h, 0.1, 100);
trajCamera.position.set(7.7, 3.05, 1);
trajCamera.position.set(6.7, -6, 10);
trajCamera.lookAt(6.7, 3.05, 0);
trajRenderer = new THREE.WebGLRenderer({ antialias: true });