최근 p5.js로 코딩하다가 ellipse에 drop shadow를 넣을 일이 생겼다.
하지만 p5.js의 reference를 찾아보아도 drop shadow을 넣을수 있는 함수는 보이지 않았다.
구글링하여 찾은 결과 p5.js는 유일하게 drop shadow를 넣을수 있는 함수를 지원을 안한다고 한다.
이에 관한 내용 첨부는 아래의 링크를 참고하면 된다.
https://github.com/processing/p5.js/wiki/p5.js-overview#createcanvas
대신 캔버스의 함수를 그대로 사용할 경우 drop shadow가 되게끔 지원해주고 있다.
결론적으로 아래와 같이 써주었더니 효과가 잘 적용되었다.
drawingContext.shadowOffsetX = 5;
drawingContext.shadowOffsetY = -5;
drawingContext.shadowBlur = 10;
drawingContext.shadowColor = "black";
'Javascript' 카테고리의 다른 글
jquery에서 each 함수의 break문 (0) | 2017.10.19 |
---|---|
p5.js에서의 push, pop 함수 (0) | 2017.10.12 |
convolution 필터를 구현할때 주의할 사항 (0) | 2017.09.15 |
e.preventDefault() 함수를 푸는법 (0) | 2017.08.28 |
progressive web app 정리글 (0) | 2017.08.28 |
댓글