How to calculate Facebook cover offset

Question

I've been trying to get some event cover images from Facebook and display them on my site. Now, people can upload images of various sizes and aspect ratios, and Facebook resizes it and allows them to center the image within a 784*295 frame. If you query Facebook API for cover image, this is what you get:

"cover": {
    "cover_id": 300822420082720,
    "offset_x": 0,
    "offset_y": 73,
    "source": "https://fbcdn-sphotos-b-a.akamaihd.net/hphotos-ak-xfp1/t1.0-9/10273881_300822420082715_6723919589261017620_n.jpg"
}

The "source" is a link to the original, non-resized/non-centered image. So I need to resize it/cut it in order for it to look exactly as the one the Facebook event page.

So the question is - how do I apply offset_x/offset_y to get the same image like the one in the 784*295 Facebook frame?

---

I have found following solutions, NONE of them correct:

• offset_y - The vertical offset in pixels of the photo from the bottom.
• The offset that facebook sends is in percentage
• pixel_offset_y = (image_height-frame_height) * offset_y / 100
• offset_y is a proportion of space between upper area and lower area of cropped image.

I have tested all of this, and more, on a couple of cover images, one of them shown in picture below. The image below is 784*522 when resized (like Facebook does), the image frame is always 784*295, the offset_y I get is 73, and the distance from the top of the picture (measured on Facebook) is 193px. What I cannot get is how to use offset_y (73) to get the number of pixels offset from top (193).

http://imgur.com/mwzcfUR

Answer 1

So, in the end, I wasn't able to find an answer to this question anywhere, but I was able to achieve a satisfactory precision using an experimental method, that is, creating my own event and testing several cover pages by moving them a few pixels at a time. The formula to calculate the number of pixels of offset that need to be applied to the FB cover image in order to get the same frame as the one used in Facebook is as follows:

$pixelsFromAbove = (($imageHeight - $frameHeight) / 86 ) * $offset_y;
$pixelsFromLeft = (($imageWidth - $frameWidth) / 86 ) * $offset_y;

Frame height and width are 295 and 784 respectively. The "86" is the experimentally obtained magical number.

This solution works with the 2.1 version of FB API.