thib8956/js-canvas-playground
1
0
Fork 0
Code Issues Pull Requests Activity

spline: convert screen to canvas coordinates

Browse Source
This commit is contained in:
thib8956
2026-08-15 13:44:15 +02:00
parent f2222079c1
commit 3a58f98acf
1 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
spline.ts
+5 -2
View File
@@ -65,13 +65,16 @@ function init() {
canvas.onmousedown = (evt: MouseEvent) => { canvas.onmousedown = (evt: MouseEvent) => {
const { clientX, clientY } = evt; const { clientX, clientY } = evt;
const rect = ctx.canvas.getBoundingClientRect();
const click = { x: clientX - rect.left, y: clientY - rect.top }; // screen to canvas coordinates
for (const p of points) { for (const p of points) {
if (Math.abs(p.x - clientX) < 10 && Math.abs(p.y - clientY) < 10) { if (Math.abs(p.x - click.x) < 10 && Math.abs(p.y - click.y) < 10) {
selection = points.indexOf(p); selection = points.indexOf(p);
} }
} }
if (selection === undefined) { if (selection === undefined) {
points.push({ x: clientX, y: clientY }); points.push({ x: click.x, y: click.y });
// redraw // redraw
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height); ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
draw(ctx, points); draw(ctx, points);