jquery ui 可调整大小 : resizing the rotated objects

Question

问题:

Jquery-ui-ressized 似乎无法正确处理旋转的对象。旋转元素后， handle 会执行与未旋转元素相同的操作。

想法:

轴可能可以根据旋转矩阵( http://en.wikipedia.org/wiki/Rotation_matrix )旋转。所以我想我们可以通过 x' = x*cos(a) -y*sin(a); y' = x*sin(a) + y*cos(a) 获得更新的鼠标坐标.

有人见过类似的解决方案(补丁或用于调整大小的独立 jquery 插件)吗？ 如果我重写_mouseStart，任何人都可以给我建议吗？和_mouseDrag jquery.ui.ressized 的方法？

Answer 1

好吧，我终于回到了我的问题并取得了一些进展:https://github.com/andyzee/jquery-resizable-rotation-patch 我决定现在不使用旋转矩阵(尽管它实际上有效)，而是切换处理程序

function switchAxis(axis, angle) {
    while(angle >= 360) angle = 360-angle;
    while(angle < 0) angle = 360+angle;
    var axisArray = ["n", "ne", "e", "se", "s", "sw", "w", "nw"];
    var octant = Math.round(angle/45); // 0 .. 7
    var index = 0;
    if ( [].indexOf ) {
        index = axisArray.indexOf(axis);
    } else {
        for(var i=0; i<axisArray.length; i++) {
            if (axisArray[i] === axis) index = i;
        }
    }
    var newAxisIndex = (index + octant) % 8;
    return axisArray[newAxisIndex];
}

我肯定会继续我的搜索，并且可能会编写自己的解决方案。