Please explain FQL profile table pic_crop

Question

What do the coordinates returned by querying pic_crop mean when related to a profile picture. I have tried working this one out by cannot figure it!

Please help!

The values for left, top, right and bottom are a decimal like e.g. left 0.20115. What does 0.20115 mean? If you look at the source code for a facebook profile you will see that facebook is using a percentage to offset the profile photo. How does 0.20115 translate to facebook source of style="left:-23.13%;"

Answer 1

https://developers.facebook.com/docs/reference/fql/profile/:

pic_crop: An object containing: uri: The URL to the largest-sized square profile picture for the object being queried. width, height: the pixel dimensions of this picture. left, top, right, bottom: the pixel co-ordinates of the user selected crop for this profile picture.

Now what about that is possibly unclear?

Answer 2

Looking at a few examples of pic_crop from my friends' profiles, it seems like the left, right, top, bottom figures are percentages of the picture's total width. For example, my profile picture returns the following values:

    "width": 180, 
    "height": 161, 
    "left": 0.11466, 
    "top": 0.06897, 
    "right": 0.88534, 
    "bottom": 0.93103

Inspecting the Facebook timeline, the profile picture is shown square at 160px. Facebook doesn't crop the photo to show it, rather they scale it to fit the cropped area behind a 160px square window and then position the photo under that window to allow the cropped photo to show.

The "top" and "bottom" values of top: 0.6897 and bottom: 0.93103 seem to equate to "no vertical crop". I can see this on my photo and several other friends' photos. So, 0.93193 - 0.06897 = 0.86206 means that 100% of the height of the photo is used. (The same values work for left and right when there is no horizontal crop.)

There is a horizontal crop on my photo. For the left and right figures on my photo, the formula seems to be: (right - left) ÷ (0.93103-0.06897). For my photo this works out to 0.89400. So, 160 × 180 / 161 = 179px × 0.89400 = 160px. I tried this on a few other friends' photos, and this works. Replacing "right - left" with "top - bottom" also seems to work for photos with a vertical crop.

On my Facebook timeline, my cover photo img tag is styled left:-5.93%;. I've got equal amounts of left and right crop, so this should be 9.5px on a side. 9.5 / 160 = 5.93%.

I haven't unraveled the scaling for asymetrical crops yet.

Gotta love it when Facebook makes it easy for you like this!

UPDATE

Just read tonight's developer's blog post and there is an alternate method for getting cropped profile photos: The profile_pic table.

SELECT url, real_width, real_height FROM profile_pic
WHERE id = me()
  AND width=160
  AND height=160

The returned url has a profile photo scaled according to your specified width and height and is cropped, more or less, to the profile owner's intent.