Graphics2D placing image with specific corner co-ordinates

Question

I need to place an image onto a canvas with the corners at specific co-ordinates.

// Blank canvas
BufferedImage img = new BufferedImage(2338, 1654, BufferedImage.TYPE_INT_ARGB);
Graphics2D g2d = img.createGraphics();
g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2d.setBackground(Color.WHITE);
g2d.clearRect(0, 0, width, EXTRA_HEADER_HEIGHT);

I have all 4 corner co-ordinates that the image corners must be placed at on the background canvas. The problem is that the original image might need to be rotated. This is basically what I need to achieve:

I don't have much experience with Graphics2D but based on a quick review of the API I can't see a method to achieve this. I am hoping that I am wrong here and that somebody can save me some time but my current thinking is:

1. Use the co-ordinates to calculate the rotation of the placed image relative to the supplied image.
2. Place the image with one of its corners in the correct position.
3. Rotate the image around that corner (without rotating background canvas).

Any help with the above would be appreciated.

Answer 1

As tucuxi commented, if you really have 4 points and want the transform to place the image corners at these exact points, and affine transform won't do -- you'll need a perspective transform.

However, if you select two points of the four, you can do what you want, but you may have to scale the image. So let's say you just want to place a rotated and scaled version of your image such that its top edge goes from A' to B'. What you'll have to do is compute the affine transform, which involves determining the rotation angle, scaling factor, and translation from the segment AB to A'B'.

Here's a commented method that should do just that. I have not thoroughly tested it, but it shows how to implement the algorithm in Java.

package stackoverflow;

import java.awt.geom.AffineTransform;
import java.awt.geom.Point2D;
import java.awt.geom.Rectangle2D;

public class ComputeImageTransform
{
    public static AffineTransform computeTransform(
            Rectangle2D imageBounds, Point2D a2, Point2D b2) {
        double dx = b2.getX() - a2.getX();
        double dy = b2.getY() - a2.getY();

        // compute length of segment
        double length = Math.hypot(dx, dy);

        // compute scaling factor from image width to segment length
        double scaling = length / imageBounds.getWidth();
        // compute rotation angle
        double rotation = Math.atan2(dy, dx);

        // build the corresponding transform
        // NOTE: the order of the individual transformations are applied is the
        // reverse of the order in which the transform will apply them!
        AffineTransform transform = new AffineTransform();
        transform.translate(a2.getX(), a2.getY());
        transform.rotate(rotation);
        transform.scale(scaling, scaling);
        transform.translate(-imageBounds.getX(), -imageBounds.getY());

        return transform;
    }

    public static void main(String[] args) {
        // transform top edge of image within this axis-aligned rectangle...
        double imageX = 20;
        double imageY = 30;
        double imageWidth = 400;
        double imageHeight = 300;

        Rectangle2D imageBounds = new Rectangle2D.Double(
                imageX, imageY, imageWidth, imageHeight);

        // to the line segment a2-b2:
        Point2D a2 = new Point2D.Double(100, 30);
        Point2D b2 = new Point2D.Double(120, 200);

        System.out.println("Transform image bounds " + imageBounds);
        System.out.println("  to top edge " + a2 + ", " + b2 + ":");

        AffineTransform transform = computeTransform(imageBounds, a2, b2);

        // test
        Point2D corner = new Point2D.Double();
        corner.setLocation(imageX, imageY);
        System.out.println("top left:     " + transform.transform(corner, null));

        corner.setLocation(imageX + imageWidth, imageY);
        System.out.println("top right:    " + transform.transform(corner, null));

        corner.setLocation(imageX, imageY + imageHeight);
        System.out.println("bottom left:  " + transform.transform(corner, null));

        corner.setLocation(imageX + imageWidth, imageY + imageHeight);
        System.out.println("bottom right: " + transform.transform(corner, null));
    }
}

This is the output:

Transform image bounds java.awt.geom.Rectangle2D$Double[x=20.0,y=30.0,w=400.0,h=300.0]
  to top edge Point2D.Double[100.0, 30.0], Point2D.Double[120.0, 200.0]:
top left:     Point2D.Double[100.0, 30.0]
top right:    Point2D.Double[119.99999999999999, 199.99999999999997]
bottom left:  Point2D.Double[-27.49999999999997, 44.999999999999986]
bottom right: Point2D.Double[-7.499999999999986, 214.99999999999997]

As you can see, you'll get some rounding errors due to the nature of floating-point computations.