如何为图像添加边框为多边形/圆形答案

【问题标题】：How to add border to the image as polygon/round shaped如何为图像添加边框为多边形/圆形
【发布时间】：2021-03-27 15:19:22
【问题描述】：

我们正在为传送带构建形状，有没有办法为图像创建一个圆形边框？以下图像是 png 文件，在所选图像周围有方形边框。在搜索时，我们从链接中找到了此代码

CSS Border on PNG image with transparent parts

img{
    -webkit-filter: drop-shadow(1px 1px 0 black) drop-shadow(-1px -1px 0 black);
    filter:drop-shadow(1px 1px 0 black) drop-shadow(-1px -1px 0 black);
}

有没有办法给画布中的图像添加阴影？请帮助我们提供相关代码和建议。

【问题讨论】：

标签： fabricjs

【解决方案1】：

我通过属性 shadow 和 strokeWidth（在 css 中通过添加阴影）来做到这一点。所以那个图像会是这样的。

item.strokeWidth = 15;               
item.shadow = new fabric.Shadow({color:'red',blur:15,affectStroke:true});

当前输出：

如果有人有更好的解决方案，请集思广益。

【讨论】：