在画布渲染后，fabric js将阴影设置为null答案

【问题标题】：fabric js set shadow to null after canvas render在画布渲染后，fabric js将阴影设置为null
【发布时间】：2020-02-21 08:35:18
【问题描述】：

我正在使用

将阴影设置为织物 js 矩形

o.setShadow("1px 1px 15px yellow");

现在阴影设置为相应的矩形，其中 o 是当前对象但是我在每 30 秒生成新矩形后使用超时重新生成矩形，但阴影仍然存在于旧位置，所以如果矩形没有阴影当矩形重新生成时，阴影仍然存在，但理想情况下应该移除所有阴影。

我试过了

o.setShadow(null) and o.setShadow(0px 0px 0px) and canvas.renderAll()

但它不起作用所有的新矩形没有阴影属性有一个null的阴影但阴影仍然存在，我需要在 settimeout 的下一次迭代中完全移除阴影。我正在使用 3.4.0 版本的 Fabric js。

【问题讨论】：

你能创建一个 sn-p/fiddle 吗？
jsfiddle.net/zqpo1k8x 我创建了两个左上角相同的矩形，所以新的矩形应该重叠并且不应该显示任何阴影，但阴影仍然存在。
您也在为第二个矩形对象添加阴影。不要添加它不会有任何阴影。
如果你想去除阴影，你可以做object.shadow = null;，fiddle
Durga 如果你从第二个矩形中移除阴影，它仍然存在

标签： javascript canvas fabricjs shadow

【解决方案1】：

obj.shadow = null; 后跟canvas#requestRenderAll，它会去除物体的阴影。

演示

const canvas = new fabric.Canvas('canvas');
const square = new fabric.Rect({
  width: 50,
  height: 50,
  left: 50,
  top: 50,
  fill: '#000'
});
square.setShadow("1px 1px 15px yellow");
canvas.add(square);
setTimeout(() => {
  square.shadow = null;
  //or square.setShadow(null);
  canvas.requestRenderAll();
},1500);

canvas {
  border : 1px solid;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/3.4.0/fabric.js"></script>
<canvas id="canvas"></canvas>

【讨论】：

我有织物 js 矩形，我正在创建更多与前一个重叠的矩形 canvas.getObjects().forEach(function(o) { o.shadow=null; });跨度>