在 HTML Canvas 中，我们可以使用 shadowOffsetY 属性来设置阴影的垂直偏移量。该属性用于指定阴影相对于形状的垂直偏移量。通过调整这个属性，我们可以创建出各种不同的阴影效果，使我们的绘图更加生动和具有立体感。
语法
context.shadowOffsetY = offset;
- context：指定绘图环境的上下文
- offset：指定阴影的垂直偏移量，可以为正数或负数
示例
让我们通过一个简单的示例来演示如何使用 shadowOffsetY 属性来设置阴影的垂直偏移量：
-- -------------------- ---- ------- ----- ------ - ------------------------------------ ----- --- - ------------------------ ------------- - ------ --------------- - -------- -------------- - --- ----------------- - -- ---------------- --- ---- -----
在这个示例中，我们首先获取了一个 Canvas 元素，并获取了它的 2D 上下文。然后我们设置了填充颜色为红色，阴影颜色为黑色，阴影模糊度为 10，以及阴影的垂直偏移量为 5。最后我们使用 fillRect 方法绘制了一个矩形。
注意事项
- shadowOffsetY 属性是作用在整个绘图环境上的，所以在调用绘图方法之前设置该属性会影响所有后续绘制的图形。
- shadowOffsetY 的默认值为 0，即阴影不做垂直偏移。
- 可以使用正数来使阴影向下偏移，使用负数使阴影向上偏移。
在实际开发中，我们可以根据具体需求调整 shadowOffsetY 的值，结合其他阴影属性，可以创造出各种炫丽的阴影效果，让我们的 Canvas 绘图更加生动和具有立体感。