Question

我正在使用画布和HTML5。我的画布和文本中有一个图标，当我尝试使用此代码在文本中添加阴影时：

    ctx.shadowColor = textShadowColor;
    ctx.shadowBlur = 1;
    ctx.shadowOffsetX = 1;
    ctx.shadowOffsetY = 1;

影子也出现在我的形象上。可能是什么问题呢。正如我所看到的那样，shadowColor会在画布上出现而不是在文本上。应该有不同的文本和图像画布？

提前致谢

Answer 1

您是先绘制文字或图片吗？

如果您首先绘制图像，则应该没有问题：

如果您首先绘制文本，则需要清除阴影，以便图片也不会被绘制。以下是首先使用阴影绘制文本的示例：

我使用保存和恢复来保存和清除上下文中的阴影状态。不过，您可以将它们全部设置为默认值。

当你在上下文中设置属性时，你需要把它想象成用油漆刷装满画笔。

将任何上下文属性（如shadowColor设置为红色）就像将红色油漆加载到画笔边缘一样。从那时起你所画的任何东西都会有红色。

阻止它的唯一方法是清理画笔（将颜色和shadowOffset设置回默认值）或使用save()和restore()，这就是说“记得我的画笔曾经清楚，所以后来我可以回想起这个清晰的画笔再次使用“。