4

问题：

Jquery-ui-resizable 似乎不适用于旋转对象。旋转元素后，手柄执行与未旋转元素相同的操作。

想法：

轴可能可以根据旋转矩阵（http://en.wikipedia.org/wiki/Rotation_matrix）旋转。所以我想我们可以用x' = x*cos(a) -y*sin(a); y' = x*sin(a) + y*cos(a).

有没有人见过类似的解决方案（补丁，或用于调整大小的独立 jquery 插件）？如果我要重写jquery.ui.resizable的_mouseStart和方法，谁能给我一个建议？_mouseDrag

4

2 回答 2

5

好的，最后我回到了我的问题并取得了一些进展：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];
}

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

于 2013-10-18T03:12:33.407 回答
3

这是我基于Andy Zee工作开发的补丁

JSFiddle

它基本上根据角度改变 dx, dy

ndx = dx * Math.cos(angle_rad) + dy * Math.sin(angle_rad);
ndy = dy * Math.cos(angle_rad) - dx * Math.sin(angle_rad);

它还改变了句柄的行为，并进行了由调整旋转元素大小引起的位置校正（在此处发布）

于 2014-09-25T10:44:39.477 回答