Question

我使用Cloudinary进行图像存储和操作。在一个地方，我创造了一个网格（2x2）的爆头。这样：

cloudinary.url(images[0], {transformation: [
  {width:90, height:90, crop:'fill'},
  {overlay:images[1], width:90, height:90, x:90, crop:"fill"},
  {overlay:images[2], width:90, height:90, y:90, x:-45, crop:"fill"},
  {overlay:images[3], width:90, height:90, y:45, x:45, crop:"fill"},
  {width:180, height:180, crop:"crop"},
]});

似乎有效。

在应用程序的其余部分中，我使用Cloudinary的人脸识别（gravity:"face"）来裁剪爆头，并且希望对网格的每个象限执行相同的操作。但是文档将gravity param定义为：

决定在拍摄＆＃39;，＆＃39; pad＆＃39;，＆＃39;拇指＆＃39;时保留图像的哪个部分。和＆＃39;填充＆＃39;使用裁剪模式。 对于叠加层，这决定了叠加层的放置位置。

它们是什么意思＆＃34;对于叠加层，这决定了叠加层的放置位置＆＃34;？如何使用重力来控制叠加的裁剪，然后将其中的四个放在网格中？

感谢。

Answer 1

默认情况下，当您在叠加层上使用gravity时，Cloudinary会相应地将叠加层放置在主图像上（例如，g_south_east会将叠加图像放置在底层的东南角上图像）。
如果您想将重力应用于叠加层本身，那么您需要相应地指示Cloudinary。这是通过使用网址中的layer_apply标记（fl_layer_apply来完成的，有关文档，请参阅here）。

试试这个：

cloudinary.url(images[0], {transformation: [
  {width:90, height:90, crop:'fill'},
  {overlay:images[1], width:90, height:90, crop:"fill", gravity:"face"},
  {x:90, flags:"layer_apply"},
  {overlay:images[2], width:90, height:90, y:90, x:-45, crop:"fill", gravity:"face"},
  {y:90, x:-45, flags:"layer_apply"},
  {overlay:images[3], width:90, height:90, y:45, x:45, crop:"fill", gravity:"face"},
  {y:45, x:45, flags:"layer_apply"},
  {width:180, height:180, crop:"crop"}
]});

制作爆头的Cloudinary网格

1 个答案: