fabric js 在 canvas 渲染后将阴影设置为 null

Question

我正在使用

将阴影设置为 fabric js 矩形

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

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

我试过了

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

但不是所有新矩形都没有阴影属性有空阴影但阴影仍然存在我需要在下一次设置超时迭代中完全删除阴影。我正在使用 Fabric js 的 3.4.0 版本。

Answer 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>

fabric js 在 canvas 渲染后将阴影设置为 null

fabric js set shadow to null after canvas render

javascript

canvas

shadow

fabricjs