如何仅在一侧设置画布矩形阴影？

Question

我只想在我的矩形底部有一个阴影，而在其他 3 个边上没有阴影。要有阴影我用这个

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.shadowBlur = 20;
ctx.shadowColor = "black";
ctx.fillStyle = "red";
ctx.fillRect(20, 20, 100, 80);

如何只在矩形的一侧应用阴影？

Answer 1

您可以添加 shadowOffset 属性。例如：

ctx.shadowOffsetX = 25;