Cloudinary-将叠加层文本添加到缩略图在图像上传小部件中进行转换

Question

我正在使用上载图像小部件，但是我想添加一个文字叠加层，但不知道如何，有人可以回答我吗？

thumbnailTransformation: [{ width: 300, height: 300, crop: 'fill', border: "2px_solid_red" }],

Answer 1

您需要包含一个overlay键，该键是具有覆盖参数的对象，在这种情况下，是特定于文本的。

例如-

thumbnailTransformation: [
  {
    width: 300,
    height: 300,
    crop: 'fill',
    border: "2px_solid_red"
  },
  {
    overlay: {
      font_family: "Arial",
      font_size: 20,
      text: "Test"
    }
  }
]

下面是一个JSFiddle，您可以尝试：https://jsfiddle.net/rhdvgy19/

可以在这里找到所有其他可用的文本样式选项-https://cloudinary.com/documentation/image_transformations#styling_parameters