Flex Demo: Matrix Math (and an error in the Actionscript docs)
I'm working on something that uses (an algorithm similar to) texture mapping, for which I want to precalculate the .invert() of a whole bunch of .transform.matrix objects. I'll post something about that in the next coupla days. Meanwhile, I found something perplexing in the Actionscript documentation but the possibility exists that I am just a dope so please point out an error in my reasoning. As you may know, you can represent any arbitrary combination of 2-D scalings, skews, rotations and translations using standard matrix operations. The Actionscript docs for the Matrix class mention this in passing, but has elements .b and .c switched: it should be
I whipped up a MatrixMathDemo in flex to demonstrate the issue: and a writeup on Mathematical matrices and the actionscript Matrix transformations [PDF]. The 2d, 3d, 4th tabs compare the Matrix methods concat(), invert() and (deltaP/p)ointTransform() respectively with an explicit calculation of the corresponding Matrix operation: they show that in fact the documentation has b and c switched. (The code is free to reuse or modify (but give credit) in case that's useful.) Some references:and not
.
- This flash-specific tutorial at senocular.com is good, though the matrices are transposed from what is typically presented.
- The posts on the flashcoders list A little matrix.invert() mystery and followup are explained by b and c being switched; they link to post on a french blog that is helpful if you parlez.
- To brush up on matrix mathematics, please see the Matrix and Quaternion FAQ or Wikpedia.
Labels: actionscript, adobe, concat, error, flex, invert, Mathematics, matrices, matrix, rotate, scale, shear, transform, translate
By the way -- if you'd like to see this fixed, vote for Bug FLEXDOCS-111 on the Flex JIRA.
Posted by
flip
|
August 25, 2007 at 12:17 AM
Hey I'd like to look at your demo and source but the link is busted. I'm having some issues with things not transforming as I'd expect.
Specifically, I have an item and a selection on a page. I want to add the item to the selection, both of which are displayObjects. When I add the item, I want it to maintain its transform on the page. You'd think this would be as simple as inverting the selection's transform and then multiplying the item's transform by it, but it's not picking up rotation for some odd reason.
My code is:
var newMatrix:Matrix = this.transform.matrix.clone();
newMatrix.invert();
newMatrix.concat(item.transform.matrix);
item.transform.matrix = newMatrix;
Any ideas?
Posted by
Ben Throop
|
October 10, 2007 at 11:11 AM
Heh, nevermind, my concat was flipped. :)
Posted by
Ben Throop
|
October 10, 2007 at 6:28 PM