2014-04-23 4 views
1

내가 여기에있는 W3C 그레이 스케일 필터를 변경하기 위해 노력하고있어 필터 : CSS에서 url (filter.svg). 나는 SVG에 대한 많은 경험이 없으며, 몇 번이나 나는 그것들을 엉망으로 만들었지 만, 백분율로 꽤 명확한 값을 가졌지 만, 회색 음영 값과 조금 더 복잡합니다.W3C 그레이 스케일 SVG는

SVG 파일의 코드는 다음과 같습니다.

<svg xmlns="http://www.w3.org/2000/svg"> 
<filter id="grayscale"> 
    <feColorMatrix type="matrix" values="0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0"/> 
</svg> 

은 특히 나는 색상의 10 %가 볼 수 있도록, 90 %에 그레이 스케일로 찾고 있어요,하지만이 필터가 어떻게 작동하는지 나는 모른다. 나는이 문서를 여기에서 발견했다

답변

4

더 쉽게하는 방법은 feColorMatrix에 대해 채도 타입을 사용하는 것입니다. (매트릭스를 사용하여 원하는 것을 수행하는 수학은 어렵지 않지만 - 산술 연산을 할 수 있다면 이 사양을 따를 수 있어야합니다.)

<svg xmlns="http://www.w3.org/2000/svg"> 
<filter id="grayscale"> 
    <feColorMatrix type="saturate" values="0.10"/> 
</svg> 
-1

시도해 보자. <feColorMatrix type="luminanceToAlpha" /> 을 속성으로 사용한다. 이렇게하면 그레이 스케일과 비슷한 것을 얻을 수 있습니다

+0

밝기를 투명도로 설정합니다. 결과는 일반적으로 단색이지만 그레이 스케일과 거의 동일하지 않습니다. – brichins