What is focal crop transform?
Focal crop transform returns an image that is cropped from a user-specified focal point. Focal crop differs from regular crop in that crop resizes from the center of the image while focal crop allows you to set the point from which cropping is focused so you aren't losing the most important of the image when cropping.
Click here to learn how to resize without cropping
It is recommended to crop to smaller dimensions. Requesting a larger size than the original will result in compromised image quality.
How to use focal crop transform
ITS changes images by appending a decorator to the end of your original url string:
https://image.pbs.org/path/to/file.jpg?crop=WWxHHxXXxYY
Where:
- crop -- indicates that ITS should perform a crop
- WW -- a numerical pixel value representing the desired width of the output image
- HH -- a numerical pixel value representing the desired height of the output image
- XX -- the x axis of the focal point, represented as a percentage value of the width of the original picture
- YY -- the y axis of the focal point, represented as a percentage value of the height of the original picture
How does ITS determine where to crop my image?
- The final width and height you want the image to be (http://image-staging.pbs.org/video-assets/mezzanine_960.jpg.focalcrop.500x400.50.100.jpeg)
- The point from which you want the image cropped (http://image-staging.pbs.org/video-assets/mezzanine_960.jpg.focalcrop.500x400.50.100.jpeg)
The point from where you want the image cropped is determined by the start point which is located in the very upper left corner of your image (Figure 1).
- I want to resize my original image, which is 1920x1080, to 500x400 while keeping the focus on the two subjects in the photo. So I will put the new image dimensions in my URL (indicated in red): http://image-staging.pbs.org/video-assets/mezzanine_960.jpg.focalcrop.500x400.50.100.jpeg.
- I want to keep the subjects in the photo so I will make the focal point to 50% from the left side of the image http://image-staging.pbs.org/video-assets/mezzanine_960.jpg.focalcrop.500x400.50.0.jpeg (Figure 2).
Width and height of the bounding box and two focal point variables are required to use this feature.
Live examples
Original image: https://image.pbs.org/test/GmtpBa4-asset-mezzanine-16x9-Uu2CpNc.png