jQuery裁剪一个圆圈[关闭]

Posted 2023-02-25

【中文标题】jQuery裁剪一个圆圈[关闭]

【英文标题】：jQuery Crop a Circle [closed]

【发布时间】：2013-02-07 14:49:04

【问题描述】：

在 jQuery/javascript 中是否有脚本可以在图像上选择一个圆圈并将坐标提供给脚本 (php / gd) 以裁剪/模糊该图像？

谢谢

【问题讨论】：

可能可以使用<canvas>。

【参考方案1】：

我不知道是否有任何圆形，但您可以使用此http://odyniec.net/projects/imgareaselect/ 选择一个矩形，然后您可以从该矩形的中心计算圆形并应用您需要的模糊裁剪。

【参考方案2】：

查看this answer，了解如何屏蔽图像以形成圆圈。基本上，有很多选择，我引用：

老式方式 - 在所需元素的顶部使用透明 png 图像的 css3 border-radius 设置为其尺寸的一半（以便边框定义一个圆圈） css3 mask 和 mask-clip 属性（这是一个很好的演示：http://www.webkit.org/blog/181/css-masks/） 画布做掩蔽 以图片为背景图案的 svg 圆圈

【讨论】：

正如我所说，我想模糊那个圆圈而不是为那个图像生成一个圆圈。例如，假设我们有一张人的照片，我想模糊该人的脸和该照片中产品的标签