Swap textAlign so labels extend into tile, not off-edge
User feedback: text on the left edge ('left' align) was getting
cut off because the text extended to negative X (off the left
edge of the canvas). Same problem on the right.
Fix: swap the textAlign so each side's text extends INTO the tile,
not OFF the edge:
- Left-side labels (S, N) now use textAlign 'right'. Anchor at
the left edge of the tile area; the text's right edge is at
the anchor and it extends rightward into the tile.
- Right-side labels (y, x) use textAlign 'left'. Anchor at the
right edge; the text's left edge is at the anchor and extends
leftward into the tile.
Mirror (scale -1, 1) is still applied so the text content is
flipped.
This commit is contained in:
1 parent
a38d942e56
commit
9191bb5776
1 file changed
+10
-7
Vendored
+10
-7
@@ -379,16 +379,19 @@ function drawTileAt(lng, perp, dx, dz, centerTileX, centerTileY) {
|
||||
groundCtx.fillText(text, 0, 0);
|
||||
groundCtx.restore();
|
||||
}
|
||||
// S at top-left (image south after Y mirror is at canvas top)
|
||||
mirrorLabel('S', canvasX + 12, canvasY + 44, 'left');
|
||||
// N at bottom-left (image north at canvas bottom)
|
||||
mirrorLabel('N', canvasX + 12, canvasY + 244, 'left');
|
||||
// S at top-left, textAlign 'right' so the text's right edge
|
||||
// is at the anchor (text extends into the tile from the left
|
||||
// edge of the tile area).
|
||||
mirrorLabel('S', canvasX + 12, canvasY + 44, 'right');
|
||||
// N at bottom-left
|
||||
mirrorLabel('N', canvasX + 12, canvasY + 244, 'right');
|
||||
// Tile coordinates, top-right and bottom-right corners
|
||||
groundCtx.font = 'bold 18px monospace';
|
||||
// y at top-right
|
||||
mirrorLabel('y=' + tileY, canvasX + GROUND_TILE_SIZE - 12, canvasY + 28, 'right');
|
||||
// y at top-right, textAlign 'left' so text extends into the
|
||||
// tile from the right edge.
|
||||
mirrorLabel('y=' + tileY, canvasX + GROUND_TILE_SIZE - 12, canvasY + 28, 'left');
|
||||
// x at bottom-right
|
||||
mirrorLabel('x=' + tileX, canvasX + GROUND_TILE_SIZE - 12, canvasY + GROUND_TILE_SIZE - 12, 'right');
|
||||
mirrorLabel('x=' + tileX, canvasX + GROUND_TILE_SIZE - 12, canvasY + GROUND_TILE_SIZE - 12, 'left');
|
||||
|
||||
return true;
|
||||
}).catch(function() {
|
||||
|
||||
Reference in new issue
Block a user