Question

使用Graph API我可以获得小型，大型，中型图片。或者我可以得到小方块图片。

但是我怎样才能获得大方形图片？我可以使用任何服务吗？

Answer 1

很简单，我刚刚发现了这一点。

实施例，

https://graph.facebook.com/friends_Id/picture?width=200&height=200

多田〜

Answer 2

奇怪的是，Facebook本身并没有使用更大的方形图像，即使它们在新的时间轴图片上显示更大的方形图像。如果仔细观察一下，他们会拍摄一个更大的矩形图像，并将其重新定位在迈克尔提出的HTML元素中。

我希望在某些时候，他们用于此的定位数据将通过API发布，但我不知道该数据是否可用。我曾经有过这段时间也会有所帮助，到目前为止，我只是将图像居中或使用了顶部。虽然FB已经允许并通过他们的“图标”创建者跟踪图像最重要的“正方形”的自定义位置，但并不理想。

Answer 3

没有办法正式这样做，这是一个愚蠢的黑客。以下代码将确保图像不宽于120像素。如果是，那么图像将溢出元素：

<div style="width: 120px; height: 120px; overflow: hidden; display: inline-block;">
    <img src="{$image}" align="absmiddle" width=120 style="min-width: 120px; min-height: 120px;" />
</div>

Answer 4

您可以使用type参数指定所需的图片大小，该参数应为方形（50x50），小（50像素宽，可变高度）和大（宽约200像素，可变高度）之一。

来自Graph API Reference。这是唯一可用的三种尺寸。你可以使用更大版本的50x50图像，但它显然会看起来抖动。

Answer 5

现在Graph实际上可以返回任何大小的方形图像。它们会缓存最常见的尺寸（例如100x100,128x128），并通过以下request (hover to see)

返回最接近的尺寸

Answer 6

正如其他答案已经说明的那样，在facebook中，方形图片只有50x50分辨率。

一个简单的CSS黑客可以解决这个问题：

查询大图片，用img包裹div - 标签并将此CSS应用于div：

img#facebook_img {
 width: YOUR_WIDTH;
}
div#wrapper {
 height: YOUR_HEIGHT;  
 overflow: hidden;  
}

如果YOUR_WIDTH和YOUR_HEIGHT相同，则会获得正方形图像并保留比例。

Answer 7

这些答案对我来说都不是很有效，因为我看到各种尺寸的轮廓图片（有些尺寸高于预期，有些高度较小），最终拉伸或非居中。

最后，我使用了div元素而不是img，并通过background-image style属性设置图片，而不是通过其src属性

CSS文件：

.profile-pic {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 120px;
    width: 120px;
    border: solid 1px #ddd;
}

HTML：

 <div style="background-image:url(https://graph.facebook.com/123/picture?width=120&height=120);" class="profile-pic"></div>

使用您想要的尺寸替换上面的120px（在CSS中出现两次，在HTML片段中出现两次）。

方形Facebook图片

7 个答案: