在透明圆上渲染图像并裁剪它

Question

我有一张背景图片： ，

我融合了一个圆圈（或eclipse）：

使得等于圆的面积在背景图像上变得透明，如下所示：  

我使用php和image magick来实现这个目标

现在，我必须以这样的方式将图像插入孔中：

1. 图像渲染在背景上方，因此只有图像区域相等 到照片孔是可见的。
2. 当我在照片孔中拖动图像时，图像会在背景后面进行分层，当再次释放时，图像将重新渲染为步骤1.
3. 我还需要裁剪在步骤1中渲染的图像。

如何使用image magick在php中实现这一目标？任何指针或帮助都非常有用。

要在图层下面的背景下传输图像，可以使用z-index吗？

完成

Answer 1

将图像裁剪为与圆相同的尺寸，然后将其放置在位置posX，posY等背景图像的顶部，可以作为一个很好的直接解决方案。

Answer 2

为了实现上述目标，我采用了这个方法：

1. 我将图像放在背景图像后面的div（正好围绕圆圈）中。 div隐藏了溢出，所以我可以包含图像。

2. 为了拖动图像，我将背景图像上的鼠标按下事件转移到下面的div。这可以使用jQuery触发器完成。

3. 现在裁剪图像我会相应地计算图像的x，y偏移量以及裁剪高度和宽度，并将数据发送到服务器进行裁剪。

希望这有助于其他人。