mirror of
https://github.com/scratchfoundation/paper.js.git
synced 2025-01-01 02:38:43 -05:00
Flip Matrix properties #b and#c
Their definition was reversed from almost all other Matrix implementations I've encountered.
This commit is contained in:
parent
40d0fca9d0
commit
e35a55fe66
1 changed files with 61 additions and 59 deletions
|
@ -23,15 +23,17 @@
|
|||
* "parallelness" of lines.
|
||||
*
|
||||
* Such a coordinate transformation can be represented by a 3 row by 3
|
||||
* column matrix with an implied last row of [ 0 0 1 ]. This matrix
|
||||
* transforms source coordinates (x,y) into destination coordinates (x',y')
|
||||
* column matrix with an implied last row of `[ 0 0 1 ]`. This matrix
|
||||
* transforms source coordinates `(x, y)` into destination coordinates `(x',y')`
|
||||
* by considering them to be a column vector and multiplying the coordinate
|
||||
* vector by the matrix according to the following process:
|
||||
*
|
||||
* [ x ] [ a b tx ] [ x ] [ a * x + b * y + tx ]
|
||||
* [ y ] = [ c d ty ] [ y ] = [ c * x + d * y + ty ]
|
||||
* [ x ] [ a c tx ] [ x ] [ a * x + c * y + tx ]
|
||||
* [ y ] = [ b d ty ] [ y ] = [ b * x + d * y + ty ]
|
||||
* [ 1 ] [ 0 0 1 ] [ 1 ] [ 1 ]
|
||||
*
|
||||
* Note the locations of b and c.
|
||||
*
|
||||
* This class is optimized for speed and minimizes calculations based on its
|
||||
* knowledge of the underlying matrix (as opposed to say simply performing
|
||||
* matrix multiplication).
|
||||
|
@ -56,7 +58,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
this.set.apply(this, arguments);
|
||||
} else if (count === 1) {
|
||||
if (arg instanceof Matrix) {
|
||||
this.set(arg._a, arg._c, arg._b, arg._d, arg._tx, arg._ty);
|
||||
this.set(arg._a, arg._b, arg._c, arg._d, arg._tx, arg._ty);
|
||||
} else if (Array.isArray(arg)) {
|
||||
this.set.apply(this, arg);
|
||||
} else {
|
||||
|
@ -75,17 +77,17 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
* Sets this transform to the matrix specified by the 6 values.
|
||||
*
|
||||
* @param {Number} a the a property of the transform
|
||||
* @param {Number} c the c property of the transform
|
||||
* @param {Number} b the b property of the transform
|
||||
* @param {Number} c the c property of the transform
|
||||
* @param {Number} d the d property of the transform
|
||||
* @param {Number} tx the tx property of the transform
|
||||
* @param {Number} ty the ty property of the transform
|
||||
* @return {Matrix} this affine transform
|
||||
*/
|
||||
set: function(a, c, b, d, tx, ty, _dontNotify) {
|
||||
set: function(a, b, c, d, tx, ty, _dontNotify) {
|
||||
this._a = a;
|
||||
this._c = c;
|
||||
this._b = b;
|
||||
this._c = c;
|
||||
this._d = d;
|
||||
this._tx = tx;
|
||||
this._ty = ty;
|
||||
|
@ -114,7 +116,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
* @return {Matrix} a copy of this transform
|
||||
*/
|
||||
clone: function() {
|
||||
return new Matrix(this._a, this._c, this._b, this._d,
|
||||
return new Matrix(this._a, this._b, this._c, this._d,
|
||||
this._tx, this._ty);
|
||||
},
|
||||
|
||||
|
@ -136,9 +138,9 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
*/
|
||||
toString: function() {
|
||||
var f = Formatter.instance;
|
||||
return '[[' + [f.number(this._a), f.number(this._b),
|
||||
return '[[' + [f.number(this._a), f.number(this._c),
|
||||
f.number(this._tx)].join(', ') + '], ['
|
||||
+ [f.number(this._c), f.number(this._d),
|
||||
+ [f.number(this._b), f.number(this._d),
|
||||
f.number(this._ty)].join(', ') + ']]';
|
||||
},
|
||||
|
||||
|
@ -148,7 +150,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
*/
|
||||
reset: function(_dontNotify) {
|
||||
this._a = this._d = 1;
|
||||
this._c = this._b = this._tx = this._ty = 0;
|
||||
this._b = this._c = this._tx = this._ty = 0;
|
||||
if (!_dontNotify)
|
||||
this._changed();
|
||||
return this;
|
||||
|
@ -194,8 +196,8 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
var point = Point.read(arguments),
|
||||
x = point.x,
|
||||
y = point.y;
|
||||
this._tx += x * this._a + y * this._b;
|
||||
this._ty += x * this._c + y * this._d;
|
||||
this._tx += x * this._a + y * this._c;
|
||||
this._ty += x * this._b + y * this._d;
|
||||
this._changed();
|
||||
return this;
|
||||
},
|
||||
|
@ -225,8 +227,8 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
if (center)
|
||||
this.translate(center);
|
||||
this._a *= scale.x;
|
||||
this._c *= scale.x;
|
||||
this._b *= scale.y;
|
||||
this._b *= scale.x;
|
||||
this._c *= scale.y;
|
||||
this._d *= scale.y;
|
||||
if (center)
|
||||
this.translate(center.negate());
|
||||
|
@ -269,12 +271,12 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
b = this._b,
|
||||
c = this._c,
|
||||
d = this._d;
|
||||
this._a = cos * a + sin * b;
|
||||
this._b = -sin * a + cos * b;
|
||||
this._c = cos * c + sin * d;
|
||||
this._d = -sin * c + cos * d;
|
||||
this._tx += tx * a + ty * b;
|
||||
this._ty += tx * c + ty * d;
|
||||
this._a = cos * a + sin * c;
|
||||
this._b = cos * b + sin * d;
|
||||
this._c = -sin * a + cos * c;
|
||||
this._d = -sin * b + cos * d;
|
||||
this._tx += tx * a + ty * c;
|
||||
this._ty += tx * b + ty * d;
|
||||
this._changed();
|
||||
return this;
|
||||
},
|
||||
|
@ -306,11 +308,11 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
if (center)
|
||||
this.translate(center);
|
||||
var a = this._a,
|
||||
c = this._c;
|
||||
this._a += shear.y * this._b;
|
||||
this._c += shear.y * this._d;
|
||||
this._b += shear.x * a;
|
||||
this._d += shear.x * c;
|
||||
b = this._b;
|
||||
this._a += shear.y * this._c;
|
||||
this._b += shear.y * this._d;
|
||||
this._c += shear.x * a;
|
||||
this._d += shear.x * b;
|
||||
if (center)
|
||||
this.translate(center.negate());
|
||||
this._changed();
|
||||
|
@ -358,17 +360,17 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
c1 = this._c,
|
||||
d1 = this._d,
|
||||
a2 = mx._a,
|
||||
b2 = mx._b,
|
||||
c2 = mx._c,
|
||||
b2 = mx._c,
|
||||
c2 = mx._b,
|
||||
d2 = mx._d,
|
||||
tx2 = mx._tx,
|
||||
ty2 = mx._ty;
|
||||
this._a = a2 * a1 + c2 * b1;
|
||||
this._b = b2 * a1 + d2 * b1;
|
||||
this._c = a2 * c1 + c2 * d1;
|
||||
this._d = b2 * c1 + d2 * d1;
|
||||
this._tx += tx2 * a1 + ty2 * b1;
|
||||
this._ty += tx2 * c1 + ty2 * d1;
|
||||
this._a = a2 * a1 + c2 * c1;
|
||||
this._c = b2 * a1 + d2 * c1;
|
||||
this._b = a2 * b1 + c2 * d1;
|
||||
this._d = b2 * b1 + d2 * d1;
|
||||
this._tx += tx2 * a1 + ty2 * c1;
|
||||
this._ty += tx2 * b1 + ty2 * d1;
|
||||
this._changed();
|
||||
return this;
|
||||
},
|
||||
|
@ -400,15 +402,15 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
tx1 = this._tx,
|
||||
ty1 = this._ty,
|
||||
a2 = mx._a,
|
||||
b2 = mx._b,
|
||||
c2 = mx._c,
|
||||
b2 = mx._c,
|
||||
c2 = mx._b,
|
||||
d2 = mx._d,
|
||||
tx2 = mx._tx,
|
||||
ty2 = mx._ty;
|
||||
this._a = a2 * a1 + b2 * c1;
|
||||
this._b = a2 * b1 + b2 * d1;
|
||||
this._c = c2 * a1 + d2 * c1;
|
||||
this._d = c2 * b1 + d2 * d1;
|
||||
this._a = a2 * a1 + b2 * b1;
|
||||
this._c = a2 * c1 + b2 * d1;
|
||||
this._b = c2 * a1 + d2 * b1;
|
||||
this._d = c2 * c1 + d2 * d1;
|
||||
this._tx = a2 * tx1 + b2 * ty1 + tx2;
|
||||
this._ty = c2 * tx1 + d2 * ty1 + ty2;
|
||||
this._changed();
|
||||
|
@ -448,8 +450,8 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
this._b = -b / det;
|
||||
this._c = -c / det;
|
||||
this._d = a / det;
|
||||
this._tx = (b * ty - d * tx) / det;
|
||||
this._ty = (c * tx - a * ty) / det;
|
||||
this._tx = (c * ty - d * tx) / det;
|
||||
this._ty = (b * tx - a * ty) / det;
|
||||
res = this;
|
||||
}
|
||||
return res;
|
||||
|
@ -487,7 +489,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
* set to `0`.
|
||||
*/
|
||||
_shiftless: function() {
|
||||
return new Matrix(this._a, this._c, this._b, this._d, 0, 0);
|
||||
return new Matrix(this._a, this._b, this._c, this._d, 0, 0);
|
||||
},
|
||||
|
||||
_orNullIfIdentity: function() {
|
||||
|
@ -498,7 +500,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
* @return {Boolean} whether this transform is the identity transform
|
||||
*/
|
||||
isIdentity: function() {
|
||||
return this._a === 1 && this._c === 0 && this._b === 0 && this._d === 1
|
||||
return this._a === 1 && this._b === 0 && this._c === 0 && this._d === 1
|
||||
&& this._tx === 0 && this._ty === 0;
|
||||
},
|
||||
|
||||
|
@ -509,7 +511,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
* @return {Boolean} whether the transform is invertible
|
||||
*/
|
||||
isInvertible: function() {
|
||||
var det = this._a * this._d - this._b * this._c;
|
||||
var det = this._a * this._d - this._c * this._b;
|
||||
return det && !isNaN(det) && isFinite(this._tx) && isFinite(this._ty);
|
||||
},
|
||||
|
||||
|
@ -561,8 +563,8 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
if (!dest)
|
||||
dest = new Point();
|
||||
return dest.set(
|
||||
x * this._a + y * this._b + this._tx,
|
||||
x * this._c + y * this._d + this._ty,
|
||||
x * this._a + y * this._c + this._tx,
|
||||
x * this._b + y * this._d + this._ty,
|
||||
_dontNotify);
|
||||
},
|
||||
|
||||
|
@ -570,8 +572,8 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
for (var i = 0, max = 2 * count; i < max; i += 2) {
|
||||
var x = src[i],
|
||||
y = src[i + 1];
|
||||
dst[i] = x * this._a + y * this._b + this._tx;
|
||||
dst[i + 1] = x * this._c + y * this._d + this._ty;
|
||||
dst[i] = x * this._a + y * this._c + this._tx;
|
||||
dst[i + 1] = x * this._b + y * this._d + this._ty;
|
||||
}
|
||||
return dst;
|
||||
},
|
||||
|
@ -633,8 +635,8 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
if (!dest)
|
||||
dest = new Point();
|
||||
res = dest.set(
|
||||
(x * d - y * b) / det,
|
||||
(y * a - x * c) / det,
|
||||
(x * d - y * c) / det,
|
||||
(y * a - x * b) / det,
|
||||
_dontNotify);
|
||||
}
|
||||
return res;
|
||||
|
@ -652,7 +654,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
// http://dev.w3.org/csswg/css3-2d-transforms/#matrix-decomposition
|
||||
// http://stackoverflow.com/questions/4361242/
|
||||
// https://github.com/wisec/DOMinator/blob/master/layout/style/nsStyleAnimation.cpp#L946
|
||||
var a = this._a, b = this._b, c = this._c, d = this._d;
|
||||
var a = this._a, b = this._c, c = this._b, d = this._d;
|
||||
if (Numerical.isZero(a * d - b * c))
|
||||
return null;
|
||||
|
||||
|
@ -699,7 +701,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
* The value that affects the transformation along the y axis when rotating
|
||||
* or skewing, positioned at (1, 0) in the transformation matrix.
|
||||
*
|
||||
* @name Matrix#c
|
||||
* @name Matrix#b
|
||||
* @type Number
|
||||
*/
|
||||
|
||||
|
@ -707,7 +709,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
* The value that affects the transformation along the x axis when rotating
|
||||
* or skewing, positioned at (0, 1) in the transformation matrix.
|
||||
*
|
||||
* @name Matrix#b
|
||||
* @name Matrix#c
|
||||
* @type Number
|
||||
*/
|
||||
|
||||
|
@ -737,13 +739,13 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
|
||||
/**
|
||||
* The transform values as an array, in the same sequence as they are passed
|
||||
* to {@link #initialize(a, c, b, d, tx, ty)}.
|
||||
* to {@link #initialize(a, b, c, d, tx, ty)}.
|
||||
*
|
||||
* @bean
|
||||
* @type Number[]
|
||||
*/
|
||||
getValues: function() {
|
||||
return [ this._a, this._c, this._b, this._d, this._tx, this._ty ];
|
||||
return [ this._a, this._b, this._c, this._d, this._tx, this._ty ];
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -786,11 +788,11 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
*/
|
||||
applyToContext: function(ctx) {
|
||||
if (!this.isIdentity()) {
|
||||
ctx.transform(this._a, this._c, this._b, this._d,
|
||||
ctx.transform(this._a, this._b, this._c, this._d,
|
||||
this._tx, this._ty);
|
||||
}
|
||||
}
|
||||
}, Base.each(['a', 'c', 'b', 'd', 'tx', 'ty'], function(key) {
|
||||
}, Base.each(['a', 'b', 'c', 'd', 'tx', 'ty'], function(key) {
|
||||
// Create getters and setters for all internal attributes.
|
||||
var part = Base.capitalize(key),
|
||||
prop = '_' + key;
|
||||
|
|
Loading…
Reference in a new issue