How can I maintain points inside a rectangle that keeps its aspect ratio inside and changing outer c-CodePudding

So my problem involves trying to keep points drawn into a rectangle at the same position of the rectangle while an outer container box is scaled to any size. The rectangle containing the points will keep its aspect ratio while it grows and shrinks in the center of the outer box.

I'm able to keep the inner box's aspect ratio constant but am having problems drawing the points in the correct place when scaling the outer box. Here's an example of my problem.

I'd like the point to stay on the same spot the picture is no matter how the outer box is scaled. The coordinate system has 0,0 as the topleft of the outer box and the inner box is centered using offsets allowing the inner box to be big as possible while maintaining its aspect ratio, however I'm stuck on getting points I add to maintain their position in the box. Here's a look at what I think I should be doing:

void PointsHandler::updatePoints()
{
    double imgRatio = boxSize.width() / boxSize.height();

    double oldXOffset = (oldContainerSize.width() - oldBoxSize.width()) / 2;
    double oldYOffset = (oldContainerSize.height() - oldBoxSize.height()) / 2;
    double newXOffset = (containerSize.width() - boxSize.width()) / 2;
    double newYOffset = (containerSize.height() - boxSize.height()) / 2;

    for(int i = 0; i < points.size(); i  ){
        double newX = ((points[i].x() - oldXOffset)   newXOffset) * boxRatio;
        double newY = ((points[i].y() - oldYOffset)   newYOffset) * boxRatio;

        points.replace(i, Point(newX, newY));
    }
}

CodePudding user response：

The requested transformations are only translations and scale.

To preserve the original aspect ratio of the inner box, the scale factor must be the same for the x and the y axes. To choose which one to apply, the user should compare the ratio between the width and the height of the new outer box with the aspect ratio of the old inner box. If it's lower, the scale should be the ratio between the new width and the old one, otherwise the ratio between the heights.

To respect the correct order of the transformations, you need to first apply a translation of the points so that the old center of inner box coincides with the origin of the axes (the top left corner of the outer box, apparently), then scale the points and finally translate back to the new center of the outer box. That's not what the posted code attempts to do, because it seems that the scale is applied last.