在Cloudinary中将两个图像链接在一起的方法

Question

我正在尝试找出将两个图像链接在一起的理想方法。我有几百张带有images标签的图片，但是有一些图片在之前和之后图片，我想并排展示。

我只是不确定如何在Cloudinary上的JSON列表中或使用Angularjs控制器链接之前和 之后的图像。

实施例

{
  "public_id": "Images 2/A/LUND",
  "version":1463185535,
  "format":"jpg",
  "width":1299,
  "height":1732,
  "type":"upload",
  "created_at":"2016-05-14T00:25:35Z",
  "context":{
    "custom":{
      "alt":"Remodeling Stairs",
      "name":"Lund Before",
      "title":"Full Staircase Remodel"
    }
  }
},
{
  "public_id": "Images 2/A/LUND",
  "version":1463185535,
  "format":"jpg",
  "width":1299,
  "height":1732,
  "type":"upload",
  "created_at":"2016-05-14T00:25:35Z",
  "context":{
    "custom":{
      "alt":"Remodeling Stairs",
      "name":"Lund After",
      "title":"Full Staircase Remodel"
    }
  }
},

我正在使用Angularjs ng-repeat，它会显示之后的图片，但我有一个显示模态的ng-click()。在模态中，我想显示之前的和之后的图片。

我怎样才能尝试将之前的图片与之后的图片链接或绑定？这可以通过Cloudinary标记来完成吗？或者在角度控制器中执行此操作的方法？

Answer 1

您可以叠加“After”图像并将其偏移以在“Before”图像结束时开始。例如：

http://res.cloudinary.com/<your_cloud_name>/image/upload/l_Images 2:A:LUND,x_1299/Images 2/A/LUND.jpg

我相信以下内容应该有效：

<link rel="shortcut icon" cl-href="Images 2/A/LUND" overlay="Images 2/A/LUND" x="1299" />

以下是将多个图像合并为一个的更多示例： http://cloudinary.com/cookbook/generate_your_photo_collage_online