Facebook 是否会公开用于裁剪较大版本的用户个人资料缩略图的偏移定位?

发布于 2024-12-20 01:52:49 字数 759 浏览 2 评论 0原文

我最近注意到,在新的时间轴个人资料的布局中,Facebook 在时间轴和好友列表中广泛使用用户个人资料图像的“正常”版本(即:更大)。众所周知,该图像是通过查询图形来检索的:

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

当然,该图像不能保证是方形裁剪。然而,Facebook 使用元素级 CSS 来手动定位和裁剪(见下图)。定位很有趣,因为它似乎是在页面渲染之前生成的。

请参阅:

http://imgur.com/lapbO

请注意如何应用元素级 CSS 样式。在这种情况下,它是一个顶部偏移:

style="top:-50%"

我假设这是从某个地方(图形、数据库等)提取任意偏移/定位值,而不是使用某些客户端 JS 进行面部检测,因为设置新的 Facebook 个人资料图片(通常)需要手动裁剪您的脸部。亲自查看:更改您的个人资料图片,如果比例不是方形的,则需要执行中间的手动裁剪步骤。

此外,该图像被发布到 /photo.php,并传递了 x、y、宽度、高度和其他各种参数。我知道其中一些用于生成 50x50 方形裁剪,但它也必须存储在其他地方,对吗?

我的问题是 Facebook 目前是否公开了一种方法来检索这些偏移值,以便我们可以准确地裁剪较大的个人资料图片,而不必依赖面部识别或客户端处理来保证主题居中。

I've recently noticed that in the layouts for the new Timeline profile, Facebook is using the "normal" version (read: larger) of the user's profile image extensively, both on the Timeline and in the Friends List. As we all know, this image is retrieved by querying the graph with:

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

Of course, this image isn't a guaranteed square crop. However, Facebook uses element-level CSS to position and crop it manually (see image below). The positioning is interesting in that it's seemingly generated before page render.

See:

http://imgur.com/lapbO

Notice how there's an element-level CSS style applied. In this case it's a top offset:

style="top:-50%"

I'm assuming that this is pulling the arbitrary offset/positioning value from somewhere (the graph, a db, etc.), not using some client-side JS for facial detection, since the process of setting a new Facebook profile picture (usually) involves manually cropping your face. See it for yourself: change your profile picture and if the proportions aren't square-ish, there's an intermediate, manual cropping step.

Furthermore, this image is posted to /photo.php with the x, y, width, height, and other various parameters passed. I know some of that is used to generate the 50x50 square crop, but it also has to be stored somewhere else, correct?

My question is whether or not Facebook currently exposes a method to retrieve these offset values so we can accurately square-crop the larger profile pictures without having to rely on facial recognition or client-side processing to guarantee that the subject is centered.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

在梵高的星空下 2024-12-27 01:52:49

在这里回答我自己的问题。
看看 http://developers.facebook.com/docs/reference/fql/profile/ 我注意到可以通过对配置文件表进行 FQL 查询来获取以下内容:

pic_crop|字符串

对象最大尺寸的方形个人资料图片的 URL
被询问。该图像的宽度至少为 100 像素。 该网址可能是
空白。

我强调最后一点。

响应如下所示:

<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 可能为空。

Answering my own question here.
Looking at http://developers.facebook.com/docs/reference/fql/profile/ I noticed it's possible to get the following with an FQL query to the profile table:

pic_crop| string

The URL to the largest-sized square profile picture for the object
being queried. The image is at least 100px in width. This URL may be
blank.

My emphasis on that last bit.

The response looks like this:

<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>

Voila: Image size and crop positioning. The only caveat, naturally, is that last bit in bold. The URL might be blank.

别想她 2024-12-27 01:52:49

向夏奇拉问好。

在此处输入图片描述

可以看到,最小的是裁剪版(手动+人脸识别),很容易当你有 X & 时,计算中间图像中的相对位置Y坐标和W& H,他们可能将其存储在数据库中,并在服务器端计算百分比。到目前为止,我还没有看到他们提供类似的东西。您最终可以仅使用这些图像来计算它,但这需要您付出代价。将背景图像设置为center center并希望得到最好的结果:)

Say hello to Shakira.

enter image description here

As you can see, the smallest one is crop version (manual + face recognition), it is easy to calculate relative position in middle image, when you have X & Y coordinates and W & H, they probably store it in database, and calculate percentage, server side. So far, I haven't seen they offer something like that. You can eventually calculate it with only these images, but that will cost you. Set background image to center center and hope for the best :)

叹梦 2024-12-27 01:52:49

我面临着同样的问题。文档中的 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
}

从这些信息中,我无​​法理解如何制作以脸部为中心的 160x160 正确裁剪

I'm facing the same problem. pic_crop as for documentation contains the pixel co-ordinates of the user selected crop for this profile picture.
It means that if the user hasn't selected a 160x160 crop, you will get a portrait or landscape.
This is confirm by the data that I'm receiving from my tests:

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

From these information I can't understand how to make a 160x160 proper crop centering the face

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文