EaselJS 0.8.0のMatrix2Dクラスにおける座標変換のメソッドの演算仕様が変わった [Edit]

Matrix2Dクラスの座標変換のメソッドは、行列の乗算で表されます。新しいEaselJS 0.8.0では、多くのメソッドの乗算の順序が改められました。行列の乗算に交換法則は成立ちませんので、古いバージョンのメソッドと異なる結果を生じることになります。そこで、0.7.1以前のバージョンのメソッドと同じ結果が得られる式を簡単にご紹介します(仕様変更された行列演算について詳しくは、「EaselJS 0.8.0: Matrix2Dクラスの基本的なメソッドと行列演算」をお読みください)。

Critical changes of the Matrix2D's transform methods in the EaselJS 0.8.0

The transformation methods of the Matrix2D class are represented by multiplication of matrices. The new EaselJS 0.8.0 changed their orientation and their results have come to be different from the former versions. This article shows some snippets to get the same results as old versions with version 0.8.0.

    Matrix2D.translate()
  • 0.7.1
    • matrix.translate(x, y)
  • 0.8.0
    • matrix.prependMatrix(new createjs.Matrix2D().translate(x, y))
    Matrix2D.scale()
  • 0.7.1
    • matrix.scale(scaleX, scaleY)
  • 0.8.0
    • matrix.prependMatrix(new createjs.Matrix2D().scale(scaleX, scaleY))
    Matrix2D.rotate()
  • 0.7.1
    • matrix.rotate(angle)
  • 0.8.0
    • matrixOld.prependMatrix(new createjs.Matrix2D().rotate(angle / createjs.Matrix2D.DEG_TO_RAD))
    Matrix2D.skew()
  • 0.7.1
    • matrix.skew(skewX, skewY)
  • 0.8.0
    • matrix.skew(skewX, skewY)

なお、以下の2点にご注意ください。

  • Matrix2D.rotate()メソッドの引数に渡す角度は、ラジアン値から度数に変わりました。
  • Matrix2D.skew()メソッドの結果は、これまでと変わりません(修正する必要はありません)。

Note the following two points:

  • The unit of angle passed to the Matrix2D.rotate() method was changed from radians to degrees.
  • The results of Matrix2D.skew() are the same. (No change is needed)

その他の記事