Javascript HTML5画布文本阴影等效物？

我试图用HTML5的画布在css的文本阴影中创建相同的效果

我可以用CSS实现这一点：

font: 36px Impact;
text-shadow: 2px 2px 2px #000,
            -2px -2px 2px #000,
             2px -2px 2px #000,
            -2px 2px 2px #000,
             2px -2px 2px #000,
             2px 2px 2px #000,
            -2px -2px 0 #000,
             2px -2px 0 #000,
            -2px 2px 0 #000,
             2px -2px 0 #000;

这将创建如下所示的字符：

但是在HTML5的画布上，笔划太细，阴影不允许我指定多个，这与文本阴影不同

---

有人知道如何做到这一点吗？

你说笔划太细了，你试过增加上下文的线宽属性吗？我认为带阴影的值为4是匹配图像的合适值

---

要在HTML5画布中绘制多个阴影，您可以在同一位置多次绘制元素，每次使用不同的阴影。

将阴影应用于文本（或任何图形）的html画布命令是

上下文。shadowBlur

以下是阴影文字效果的起点：

确保在抚摸文本后填充文本，否则阴影将侵入填充

ctx.font="75px verdana";
ctx.shadowColor="black";
ctx.shadowBlur=7;
ctx.lineWidth=5;
ctx.strokeText("HELLO",25,100);
ctx.shadowBlur=0;
ctx.fillStyle="white";
ctx.fillText("HELLO",25,100);

---

您尝试过的画布代码是什么？请与我们分享您迄今为止使用的代码，以便我们可以查看问题。因此，我已将线宽设置为4，并且非常接近，但我不知道要给它什么阴影。这是我的代码：context.fillStyle='white'；context.strokeStyle='black'；context.lineWidth=4；var fontSize=（canvas.height/8）；context.font=fontSize+“px影响”；context.textAlign='center'；虽然这很有帮助，但也有点误导。请看这里：您不需要在文本上划一笔，只需填写即可。