Mirror tile content across NS axis (image + N/S labels only)

User feedback: the corridor arrangement is correct (lng=+12
at screen top in N flight), but the per-tile image and labels
were upside down relative to expectations.

- Image drawing: changed from 180° rotation (-TILE, -TILE on
  both axes) to Y-only flip (TILE, -TILE on Y). Image top
  (north) now lands at canvas bottom; image bottom (south) at
  canvas top. X axis is preserved so image east is still on the
  right within each tile.
- N/S labels: swapped so N is at canvas bottom (= image north)
  and S at canvas top (= image south).
This commit is contained in:
Richard Zink committed 2026-10-08 08:06:27 +02:00
1 parent 91ff8fb9d7
commit 5ba7596ced
1 file changed
+12 -8
+12 -8
View File
@@ -346,8 +346,11 @@ function drawTileAt(lng, perp, dx, dz, centerTileX, centerTileY) {
// (canvasX + 256, canvasY + 256). After this, image north
// (high lat) is at canvas bottom and image south at canvas
// top; image east at canvas right, image west at canvas left.
groundCtx.drawImage(img, canvasX + GROUND_TILE_SIZE, canvasY + GROUND_TILE_SIZE,
-GROUND_TILE_SIZE, -GROUND_TILE_SIZE);
// Flip image only on the Y axis (NS mirror). Image top
// (north) -> canvas bottom, image bottom (south) -> canvas
// top. X axis (EW) is preserved.
groundCtx.drawImage(img, canvasX, canvasY + GROUND_TILE_SIZE,
GROUND_TILE_SIZE, -GROUND_TILE_SIZE);
groundLoadedTiles[tileX + '_' + tileY] = true;
// Debug labels: 'N' at the image's north edge (top of canvas
@@ -359,12 +362,13 @@ function drawTileAt(lng, perp, dx, dz, centerTileX, centerTileY) {
groundCtx.lineWidth = 3;
groundCtx.font = 'bold 48px sans-serif';
groundCtx.textAlign = 'center';
// N at canvas top of tile area (= north in image)
groundCtx.strokeText('N', canvasX + 128, canvasY + 56);
groundCtx.fillText('N', canvasX + 128, canvasY + 56);
// S at canvas bottom of tile area
groundCtx.strokeText('S', canvasX + 128, canvasY + 240);
groundCtx.fillText('S', canvasX + 128, canvasY + 240);
// N at canvas bottom of tile area (image north is at canvas
// bottom because image is Y-flipped).
groundCtx.strokeText('N', canvasX + 128, canvasY + 240);
groundCtx.fillText('N', canvasX + 128, canvasY + 240);
// S at canvas top
groundCtx.strokeText('S', canvasX + 128, canvasY + 56);
groundCtx.fillText('S', canvasX + 128, canvasY + 56);
// Tile coords
groundCtx.font = 'bold 20px monospace';
groundCtx.strokeText('x=' + tileX + ' y=' + tileY,