ADOBE AFTER EFFECTS: Forum Expressions Tutorials Creative Cloud

# Scale up rotated rectangle to cover comp canvas.

FAQ   •   VIEW ALL
 Scale up rotated rectangle to cover comp canvas. on Nov 6, 2018 at 10:40:09 am

Let's say I have a comp with the width compWidth and the height compHeight.
In that comp I have a rectangle with the width shapeWidth, the height shapeHeight and rotation shapeRotation.
I now want to rotate the rectangle. But I want to make sure that it always covers the comp.

Example: the pink shape should automatically scale up so it covers the black areas.

I've already set up so the rectangle scales up to the comp to its "shortest" side with this scale expression:

```wCalc = (compWidth / shapeWidth ) * 100; hCalc = (compHeight / shapeHeight ) * 100; sca = Math.max(wCalc, hCalc); [sca, sca]```

But here is where my math skills meet their limit. How can I incorporate the rotation with my existing scale expression to cover the comp at all times?

 Re: Scale up rotated rectangle to cover comp canvas.on Nov 7, 2018 at 3:03:02 pm

I managed to get this far. This is a trigonometric problem. We know where points O and P are, the don't move. There are two lines that can be defined by being at a known angle and going through a known point. Alpha is the angle of rotation. The blue line goes through point P and is at angle alpha from the vertical (or 90-alpha from the horizontal). The red line goes through O and is at the angle of 45+alpha from the horizontal. Their common point R2 tells us where the corner of the scaled and rotated square is. The division of the distance of O to R1 (same as distance of O to P) and O to R2 is the scale.

So the basic problem is finding the coordinates where the two lines meet. Does someone want to take it the rest of the way?

Kalleheikki Kannisto
Senior Graphic Designer

 Re: Scale up rotated rectangle to cover comp canvas.on Nov 7, 2018 at 3:17:05 pmLast Edited By Kalleheikki Kannisto on Nov 7, 2018 at 3:22:43 pm

It is actually very close to this problem here:

https://stackoverflow.com/questions/622140/calculate-bounding-box-coordinat...

As long as it is square, you can get the scale from the difference of the bounding box and the original box directly, if it is a rectangle and you need to constrain proportions, it's a bit more tricky. I think you'll have to check the result in x and y direction for any given angle and pick the larger of the two.

Kalleheikki Kannisto
Senior Graphic Designer

 Re: Scale up rotated rectangle to cover comp canvas.on Nov 7, 2018 at 4:41:01 pm

Assuming it is a square, in middle of the comp, and the same size of the comp, it would be this:

``` a = degreesToRadians(Math.abs(transform.rotation%90)); h = Math.sqrt(2 * Math.pow(value[0]/2, 2)); o = Math.cos(a - degreesToRadians(45))*h; s = 2*o / value[0]; value*s ```

Alex Printz
Mograph Designer