Calculate elements new position after scaling

399 Views Asked by At

I have two elements (which can be seen as two circles) in a container box and I want to scale them up to 3 times their original size. The problem is that they must be repositioned in order for original layout to be maintained and to avoid overlapping. The following image can be taken as an example of the before and after scalling.

Scalling before and after

As you can see, if I just scale both elements they will overlap each other. Is there any formula that I can use to recalculate their position and maintain the layout? They should be repositioned taking into account that if an element has the cordinates of x = 0 and y = 0 (in a graph where the coordinate (0, 0) is in the top left corner) then it should maintain that top left position.

1

There are 1 best solutions below

0
On

The answer is simple and I just realized it 5 minutes after posting this. If I want to scale to 3 times, I just have to multiply everything by 3 (x, y, width and height).