HTML5/SVG
SVG Filters
Jundol
2015. 6. 9. 11:11
* 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.
* 필자의 기준이 절대적인 진리는 아닙니다.
SVG Filters - Intro
지원되는 브라우저
- 크롬 8.0 이상
- IE 10.0 이상
- FF 3.0 이상
- 사파리 6.0 이상
- 오페라 9.6 이상
SVG 필터 요소
다음 장에서부터는 터치(설정할수있는)가 가능한 필터들만 보여줄 것이다. 그리고 SVG를 이용해서 어떤것들을 할 수 있는지 아이디어를 줄 것이다.
SVG에서 사용가능한 필터 목록 :
- <feBlend> - 이미지결합 필터
- <feColorMatrix> - 색상변화를위한 필터
- <feComponentTransfer>
- <feComposite>
- <feconvolveMatrix>
- <feDiffuseLighting>
- <feDisplacementMap>
- <feFlood>
- <feGaussianBlur>
- <feImage>
- <feMerge>
- <feMorphology>
- <feOffset> - 그림자 효과를 위한 필터
- <feSpecularLighting>
- <feTile>
- <feTurbulence>
- <feDistantLight> - 빛을 위한 필터
- <fePointLight> - 빛을 위한 필터
- <feSpotLight> - 빛을 위한 필터
Tip : 각각의 SVG요소에 여러개의 필터를 중복해서 사용이 가능하다.
출처 W3School.com - SVG - Filters