fabricjsで回転したオブジェクトのコーナーの座標を見つける

私はfabricjsキャンバスにイメージがあるとします。画像のtop & leftの値とそのサイズに基づいて、コーナーの座標を簡単に計算できます。fabricjsで回転したオブジェクトのコーナーの座標を見つける

イメージをある程度回転させたときにどうすればいいですか？

例：

enter image description here

EDIT：好ましくは、三角法を使用することなく、どこかfabricjs自体または内に実装簡単な方法がある場合。

2013-02-14 seldary

（オブジェクトを回転させてみてください）http://fabricjs.com/bounding-rectangle/でのアクションでそれを見ることができます> http://en.wikipedia.org/ wiki/Rotation_（数学） – BenM

ありがとう - 私の編集を参照してください。 – seldary

あなたは三角関数を使わなければなりません。そのための組み込みメソッドはありません。 – BenM

はい、もちろんです。

私たちは、あなたがsetCoordsメソッドを呼び出したときに設定されます何のオブジェクトのoCoords

oCoords.tl.x, oCoords.tl.y // top left corner 
oCoords.tr.x, oCoords.tr.y // top right corner 
oCoords.bl.x, oCoords.bl.y // bottom left corner 
oCoords.br.x, oCoords.br.y // bottom right corner

におけるそれらの座標を格納します。

しかし、おそらくそれらを混乱させたくありません。

バージョン〜1.0.4以降、すべてのオブジェクトに対してgetBoundingRectメソッドがあり、これは{ left: ..., top: ..., width: ..., height: ... }を返します。以前はgetBoundingRectWidthとgetBoundingRectHeightでしたが（現在は非推奨）、getBoundingRectは確かに便利です。左/上の値も読み取ることができます。

あなたは、開始点を計算し、その後、それらは回転に基づいている計算するために行列を使用

出典

2013-02-15 02:17:29 kangax

ありがとうございます - 私は完璧なoCoordsを使用しました。 Math.sinの必要はありません！それは私が9つのデフォルトのものの代わりにオブジェクトの2つの隅にカスタムメイドのハンドルを "アタッチ"することを可能にしました... – seldary

リンクは利用できません –

リンクはhttp://fabricjs.com/bounding-rectangle ） – kikap

fabricjsで回転したオブジェクトのコーナーの座標を見つける

答えて

関連する問題