javascript - キャンバス画像エディター

Question

キャンバスで画像エディタを作ろうとしていますが、回転した画像のサイズを変更する際に問題が発生しました。アンカーのサイズを変更すると、イメージが正しく整列していないようです。

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

(クリックすると画像が回転します。サイズ変更のテスト用です)

これを修正する方法の手がかりはありますか？

角度を pi で割る必要があることがわかりましたが、bl を機能させることができず、アンカーがまだ完全に一致していません =/

Answer 1

角のハンドルを含めて、グループが既に回転していることがわかったので、三角法はまったく必要ありません。

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;