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