matrix, rotate and translate help needed

[vintage]

I draw() a new bitmap with the use of a transform matrix, but Im having serious problems with calculating de translate positions after rotate...

Is there some kind of formula/function to calculate the matrix.translate Numbers after matrix.rotate ?

What I do now is something like this:


var matrix = new Matrix();
matrix.identity();
matrix.rotate(2 * Math.PI * (rotatie / 360)); //rotatie is a Number that I "post" via a dropbox
matrix.translate(helpX, helpY); //HELP ME HERE PLEASE :)


var bmd:BitmapData = new BitmapData(b, h);
bmd.draw(img, matrix);

var bm:Bitmap = new Bitmap(bmd);
img = bm; //img is a bitmap variable on the stage
addChild(img);

I actually did read a gazzilion tuts and topics about the matrix, but I didnt find anything about this.
Any help would be appreciated. thx

[piterwilson]

Hello

this tutorial explains just that

http://www.8bitrocket.com/newsdisplay.aspx?newspage=6765

except... it really only works when the bitmapData has width=height (and the corners cut off)

this other one

http://jobemakar.blogspot.com/2007/06/rotating-around-point.html

uses MatrixTransformer.rotateAroundExternalPoint which is a neat function to check out. Unfortunetly theres no code example on its usage which is bad

But as you can see, im having some problem of my own (see http://www.kirupa.com/forum/showthread.php?t=297453)

hope that helps.

[piterwilson]

it would seem this is an easy trivial task but that Matrix sure complicates things...
Please someone help us!

[substance]

public static function PreRotate(img:Object):Array{
RI = new Array();
for (var i:Number = -18; i < 19; i++){
var rotationMatrix:Matrix = new Matrix();
var temp:Number = Math.sqrt((img.width/2)*(img.width/2)+(img.height/2)*(img.height/2));
rotationMatrix.identity()
rotationMatrix.translate(-img.width/ 2,-img.height / 2);
rotationMatrix.rotate(i * Math.PI/180 * 10);
rotationMatrix.translate(temp,temp);
RI[i] = new BitmapData(temp*2, temp*2, true, 0x000000);
RI[i].draw(img, rotationMatrix);
}
return RI
}

[vintage]

Thank you guys!
The script substance posted is almost perfect, it takes the right sizes and rotation , but it draws the new bitmap on the wrong place, I have to puzzle a little with that.
The new bitmaps need to be on the scene's x:0 and y:0, while this script moves the new bitmap every time.
I think its beqausse the translate uses the same values for x and y.

once again, THX :)

update:
I am a little further now, the code doesnt draw my images on the wrong place anymore, but it does "crop" the "copy" to the smallest value.

For example:
flash loads an image from 400*200 px
Rotate it with 90
and draw() a new image, with the right sizes, but the content is now 200*200 instead of 200*400.

Im horrible with math, so I hope you guys can help me out once more :)

this is what I have so far..



var rotatie:Number = 90;

var rotationMatrix:Matrix = new Matrix();
var tempX:Number = Math.sqrt((img.width/2)*(img.width/2));
var tempY:Number = Math.sqrt((img.height/2)*(img.height/2));

rotationMatrix.identity();
rotationMatrix.translate(-img.width/ 2,-img.height / 2);
rotationMatrix.rotate(2 * Math.PI * (rotatie / 360));
rotationMatrix.translate(tempX,tempY);

var bmd:BitmapData = new BitmapData(tempX*2, tempY*2, true, 0x000000);


Since my english isnt that good, here an image what happens
http://www.imgdumper.nl/uploads/482410e36c00e/482410e35f8e5-rotated_bitmap.png

[vintage]

Solved, I now have this and works like a charm :) (since I only need to rotate with 90)


var rotatie:Number = 90;
var rotationMatrix:Matrix = new Matrix();
var tempX:Number = Math.sqrt((img.width/2)*(img.width/2));
var tempY:Number = Math.sqrt((img.height/2)*(img.height/2));
var bmd:BitmapData;
rotationMatrix.identity();
rotationMatrix.translate(-img.width/ 2,-img.height / 2);
rotationMatrix.rotate(2 * Math.PI * (rotatie / 360));
rotationMatrix.translate(tempY,tempX); //this

bmd = new BitmapData(tempY*2, tempX*2, false, 0x00ff00);
bmd.draw(img, rotationMatrix);