From d063e5e864bbc0f79dafff637d399cddbadce9a0 Mon Sep 17 00:00:00 2001 From: Richard Zink Date: Thu, 8 Oct 2026 07:33:56 +0200 Subject: [PATCH] Revert canvasX swap: east on canvas left (matches user's x gradient) User feedback: x decreasing left-to-right (matches NO swap), y increasing in flight direction (matches swap). So the swap on canvasY is right but the swap on canvasX was wrong direction. With the no-swap canvasX formula: - perp = -2 (east, dx=+2) at canvasX = 128 (left) - perp = +2 (west, dx=-2) at canvasX = 1152 (right) After UNPACK flip: canvasX stays as-is. User at canvas right sees west (low x). User at canvas left sees east (high x). x decreases left-to-right in the label content, matching what the user sees in the satellite imagery too. (The Y swap remains so lng=+12 -> canvasY=128 -> screen top, so north tiles still appear at the top of the screen.) --- vendor/clouds3d.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/vendor/clouds3d.js b/vendor/clouds3d.js index ec2142a..bb76aec 100644 --- a/vendor/clouds3d.js +++ b/vendor/clouds3d.js @@ -329,10 +329,11 @@ function drawTileAt(lng, perp, dx, dz, centerTileX, centerTileY) { // corridor's long axis (flight direction +Z) appears as a vertical // strip on canvas, matching the way depth maps on screen. // UNPACK_FLIP_Y_WEBGL=true inverts V: canvas top -> texture V=1 (top). - // To put lng=+12 (corridor front in N flight) at screen TOP we put it - // at canvas top (small canvasY). Same inversion for perp so world - // east (dx>0, perp<0) ends up at canvas right (large canvasX). - var canvasX = (-perp + halfPerp + 0.5) * GROUND_TILE_SIZE; + // For lng axis (Y): invert canvasY so lng=+12 (corridor front in + // N flight) lands at small canvasY (= screen top after flip). + // For perp axis (X): keep the natural sign so world east (dx>0) + // ends up at canvasX > halfPerp area (right side of canvas). + var canvasX = (perp + halfPerp + 0.5) * GROUND_TILE_SIZE; var canvasY = (-lng + halfLong + 0.5) * GROUND_TILE_SIZE; if (canvasX < 0 || canvasX >= groundCanvas.width || canvasY < 0 || canvasY >= groundCanvas.height) { return Promise.resolve(false);