html5画布上的发光效果?

时间:2011-10-18 22:13:46

标签: javascript html5-canvas glow

是否可以为已经绘制的画布添加发光效果而无需自己计算? (使用渐变,阴影或其他东西......)

我尝试通过将画布作为图像绘制到不同的画布并使用添加的阴影将其绘制回来来添加光晕。 问题在于它取决于阴影周围的像素数量 - 因为它模糊了图像 - 所以这还不够好。

1 个答案:

答案 0 :(得分:4)

有一个网站可以查看发光效果以及画布文字here的其他印刷效果。

这里是发光效果的要点:

// Assuming your canvas element is ctx
ctx.shadowColor = “red” // string
    //Color of the shadow;  RGB, RGBA, HSL, HEX, and other inputs are valid.
ctx.shadowOffsetX = 0; // integer
    //Horizontal distance of the shadow, in relation to the text.
ctx.shadowOffsetY = 0; // integer
    //Vertical distance of the shadow, in relation to the text.
ctx.shadowBlur = 10; // integer
    //Blurring effect to the shadow, the larger the value, the greater the blur.