html5 캔버스에 광선 효과가 있습니까?

Question

이미 그려진 캔버스 에 그로우 효과를 추가 할 수 있습니까? 직접 계산하지 않아도됩니까?? (그라디언트, 그림자 또는 뭔가 사용하기 ...)

캔버스를 이미지로 다른 캔버스에 그려 그림자를 추가하여 그려 보는 방법을 추가했습니다. 문제는 그림자 주위의 픽셀 양에 의존한다는 것입니다. 이미지가 흐려지기 때문에 충분하지 않습니다.

Answer 1

캔버스 텍스트 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. 

: 여기

는 광선 효과의 요점이다