Предоставляет ли Facebook смещение для обрезки увеличенной версии миниатюры профиля пользователя?

Question

Я недавно заметил, что в макетах для нового профиля временной шкалы Facebook широко использует «обычную» версию (читай: больше) изображения профиля пользователя, как на временной шкале, так и в списке друзей.Как все мы знаем, это изображение получается путем запроса графика с:

https://graph.facebook.com/[userid]/picture?type=normal

Конечно, это изображение не является гарантированным квадратным кадрированием.Тем не менее, Facebook использует CSS на уровне элементов, чтобы расположить и обрезать его вручную (см. Изображение ниже).Позиционирование интересно тем, что, по-видимому, оно генерируется перед визуализацией страницы.

См .:

Обратите внимание, как применяется стиль CSS на уровне элементов.В данном случае это верхнее смещение:

style="top:-50%"

Я предполагаю, что это извлекает произвольное значение смещения / позиционирования откуда-то (график, дБ и т. Д.), Не используя какую-либо сторону клиентаJS для определения лица, так как процесс установки нового изображения профиля Facebook (обычно) включает в себя ручную обрезку вашего лица.Убедитесь сами: измените изображение своего профиля, и если пропорции не являются квадратными, есть промежуточный шаг ручной обрезки.

Кроме того, это изображение публикуется в /photo.php с x, y, ширина, высота и другие параметры передаются.Я знаю, что кое-что из этого используется для генерации квадратного урожая 50x50, но его также нужно хранить где-то еще, правильно?

Мой вопрос заключается в том, предоставляет ли Facebook метод извлечения этих значений смещения, чтобы мы моглиможет точно обрезать большие изображения профиля без необходимости распознавания лиц или обработки на стороне клиента, чтобы гарантировать, что объект находится в центре.

Answer 1

Отвечая на мой собственный вопрос здесь. Глядя на http://developers.facebook.com/docs/reference/fql/profile/ Я заметил, что с помощью FQL-запроса к таблице профиля можно получить следующее:

pic_crop| string

URL-адрес изображения квадратного профиля самого большого размера для объекта запрашивается. Изображение имеет ширину не менее 100 пикселей. Этот URL может быть пустой.

Мой акцент на этом последнем бите.

Ответ выглядит так:

<fql_query_response list="true">
  <profile>
    <pic_crop>
      <uri>https://fbcdn-profile-a.akamaihd.net/hprofile-ak-snc4/xxxxxx_xxxxxxxx_xxxxxxxxxx_n.jpg</uri>
      <width>180</width>
      <height>173</height>
      <left>0.08468</left>
      <top>0.06897</top>
      <right>0.91532</right>
      <bottom>0.93103</bottom>
    </pic_crop>
  </profile>
</fql_query_response>

Вуаля: Размер изображения и расположение кадрирования. Единственное предостережение, естественно, это последний жирный шрифт. URL может быть пустым.

Answer 2

Я столкнулся с той же проблемой. pic_crop, как и для документации, содержит координаты пикселей выбранного пользователем кадрирования для этого изображения профиля. Это означает, что если пользователь не выбрал кадрирование 160x160, вы получите портрет или пейзаж. Это подтверждают данные, которые я получаю из моих тестов:

{
  "uri": "http://profile.ak.fbcdn.net/hprofile-ak-snc4/xxxxxxxxx_n.jpg",
  "width": 180,
  "height": 286,
  "left": 0,
  "top": 0,
  "right": 1,
  "bottom": 1
}

Из этой информации я не могу понять, как сделать 160х160 правильных кадрировок по центру лица

Answer 3

Скажи привет Шакире.

Как видите, наименьшая - это версия кропа (ручная + распознавание лица), легко вычислить относительное положение в серединеЕсли у вас есть координаты X & Y и W & H, они, вероятно, сохраняют их в базе данных и рассчитывают процент на стороне сервера.До сих пор я не видел, чтобы они предлагали что-то подобное.Вы можете в конечном итоге рассчитать его только с этими изображениями, но это будет стоить вам.Установите фоновое изображение на center center и надейтесь на лучшее:)