画布图像编辑器

时间:2012-02-26 15:22:15

标签: javascript math canvas kineticjs

我正在尝试使用画布制作图像编辑器,但是我在重新调整旋转图像大小时遇到​​了一些问题。我的重新尺寸锚和图像似乎没有按照它们排列。

http://jsbin.com/isexig/9/edit#source

(单击时图像将旋转,仅用于测试重新调整大小)

任何线索如何解决这个问题?

我发现角度需要用pi分割,但是我没能让bl工作,而且锚点仍然不能完美匹配= /

1 个答案:

答案 0 :(得分:2)

我发现该组已经旋转,包括角手柄,因此您根本不需要任何三角法:

http://jsbin.com/abejab/5/edit

switch (activeAnchor.name) {
case "tl":
case "br":
    bl.x = tl.x;
    bl.y = br.y;
    tr.x = br.x;
    tr.y = tl.y;
    break;
case "tr":
case "bl":
    br.x = tr.x;
    br.y = bl.y;
    tl.x = bl.x;
    tl.y = tr.y;
    break;
}
image.x = tl.x;
image.y = tl.y;
image.width = tr.x - tl.x;
image.height = bl.y - tl.y;