Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | import React from 'react';
import type { Point } from '@/shared/types';
/**
* Returns coordinates in CANVAS SPACE (its internal width/height),
* regardless of CSS transforms/scale.
*/
export function toCanvasPoint(
e: React.PointerEvent<HTMLCanvasElement>,
canvas: HTMLCanvasElement,
opts?: { dpr?: number },
): Point {
const rect = canvas.getBoundingClientRect();
// Normalize to [0..1] inside visible rect
const nx = (e.clientX - rect.left) / rect.width;
const ny = (e.clientY - rect.top) / rect.height;
const dpr = opts?.dpr ?? 1;
return {
x: (nx * canvas.width) / dpr,
y: (ny * canvas.height) / dpr,
};
}
|