缩放和旋转织物后在画布内移动对象

Question

当对象被旋转/缩放时，我可以在画布边界内移动它。请看下面的小提琴 - http://jsfiddle.net/JtRhX/33/

问题步骤：

1. 缩放图像> 大于画布宽度/高度。
2. 问题1：尝试将obj向任意方向移动1px，obj会立即转到object的另一端原因：moving event
3. 问题2：缩放图像后，obj的移动也是反向的。

我使用下面的代码来检查他的边框在顶部的位置，类似于 bot

if(obj.getBoundingRect().top < 0 || obj.getBoundingRect().left < 0){
    obj.top = Math.max(obj.top, obj.top-obj.getBoundingRect().top);
    obj.left = Math.max(obj.left, obj.left-obj.getBoundingRect().left);
}

Answer 1

对于小提琴代码中的 cmets

//如果对象太大忽略

您似乎希望在这种情况下允许越过画布的边缘。

如果是这样，您只需要更改此行：

if(obj.currentHeight > obj.canvas.height || obj.currentWidth > obj.canvas.width) {

对于这个：

if(obj.getBoundingRect().height > canvas.height || obj.getBoundingRect().width > obj.canvas.width) {

请注意obj.currentHeight 和obj.currentWidth 都是未定义。

希望对你有帮助！