add option to invert z axis

This commit is contained in:
Luca Conte 2025-04-26 01:13:26 +02:00
parent 5a0cbe6e35
commit f56912b41e
2 changed files with 15 additions and 8 deletions

View File

@ -58,6 +58,9 @@
</li>
<li>
Projection Matrix: <input type="range" min=0 max=1 step=0.01 value=0 id="interpolateProjection" autocomplete="off" disabled="yes">
<ul>
<li>Invert Z-Axis: <input type="checkbox" id="invertZAxis" checked autocomplete="off"></li>
</ul>
</li>
<li>
Use virtual camera: <input type="checkbox" id="displayMatricesVirtually" checked autocomplete="off">

View File

@ -31,6 +31,8 @@ let interpolateLookAt = 0;
let displayMatricesVirtually = true;
let virtualRealInterpolation = 1;
let invertZAxis = true;
let cameraPitch = 0.565;
let cameraYaw = 0.375;
let cameraDistance = 4;
@ -57,6 +59,9 @@ async function init() {
document.getElementById("interpolateLookAt").disabled = "yes";
}
});
document.getElementById("invertZAxis").addEventListener("input", (e) => {
invertZAxis = e.target.checked;
});
document.getElementById("interpolateLookAt").addEventListener("input", (e) => {
interpolateLookAt = e.target.value;
if (interpolateLookAt >= 1) {
@ -454,9 +459,6 @@ async function draw() {
let realCameraPosition = [Math.cos(cameraYaw) * smoothCameraDistance * Math.cos(cameraPitch), Math.sin(cameraPitch) * smoothCameraDistance, Math.sin(cameraYaw) * smoothCameraDistance * Math.cos(cameraPitch)];
let realCameraLookAt = [0, 0, 0];
let realCameraUp = [0, 1, 0];
// if (cameraPitch > -0.1) {
// realCameraUp = [Math.cos(cameraYaw), 0, Math.sin(cameraYaw)];
// }
mat4BuildLookAt(realViewMatrix, realCameraPosition, realCameraLookAt, realCameraUp);
mat4Interpolate(realProjectionMatrix, identity, realProjectionMatrix, virtualRealInterpolation * virtualRealInterpolation);
@ -478,11 +480,13 @@ async function draw() {
let virtualProjectionMatrix = [];
mat4BuildPerspective(virtualProjectionMatrix, 90.0 / 180.0 * Math.PI, cv.width / cv.height, 1, 5);
if (displayMatricesVirtually) {
// virtualProjectionMatrix[8] *= -1;
// virtualProjectionMatrix[9] *= -1;
// virtualProjectionMatrix[10] *= -1;
// virtualProjectionMatrix[11] *= -1;
if (!invertZAxis) {
let zAxisFlipMatrix = [];
mat4Identity(zAxisFlipMatrix);
zAxisFlipMatrix[10] = -1;
mat4Interpolate(zAxisFlipMatrix, identity, zAxisFlipMatrix, virtualRealInterpolation);
mat4Multiply(virtualProjectionMatrix, zAxisFlipMatrix, virtualProjectionMatrix);
}
let inverseVirtualProjectionMatrix = [];