javascript - 如何仅在画布边界中实现拖放图像

Question

我已经实现了拖放功能，但我现在需要的是一个可以禁用从 Canvas 上拖动的功能。

当我在左上角的图片有坐标 x: 0, y: 0，但如果移动到坐标的左侧则变为负数（例如 X: -1, -2 ... -100）。

我想要做的是不允许图像在画布之外移动。

欢迎任何想法甚至更好的代码

Answer 1

你回答得差不多了。如果图片 x 位置是 -2，只需将其恢复为 0。

// Checks if the picture is beyond the x boundary's...
if (picture.x < 0) { 
    picture.x = 0; 
} else if ((picture.x + picture.width > canvas.width) {
    picture.x = canvas.width - picture.width;
}

同样适用于 y 轴。