SVG గౌస్ బ్లర్

SVG ఫిల్టర్‌ను <defs> టాగ్‌లో నిర్వచించాలి.

గౌస్ బ్లర్ (Gaussian Blur)

<filter> టాగ్‌లు SVG ఫిల్టర్లను నిర్వచిస్తాయి.<filter> టాగ్‌లు మరుగుపాత్రను ఉపయోగిస్తుంది ఫిల్టర్ కు ఎంతో ప్రభావాన్ని వినియోగించాలి?

<filter> టాగ్‌లు <defs> టాగ్‌లో చొప్పించబడాలి.<defs> టాగ్‌లు డిఫినీషన్స్ యొక్క సంక్షిప్త రూపం, ఇది ఫిల్టర్లు వంటి ప్రత్యేక ఉపాంగాలను నిర్వచించడానికి అనుమతిస్తుంది.

ఈ కోడ్‌ను నిజానికి కాపీ చేసి, కాపీబోతున్న ఫైల్‌ను "filter1.svg" అనే పేరుతో దాచి, అప్పగించిన వెబ్ డెస్క్‌రిప్షన్‌లో దానిని పెట్టండి:

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<defs>
<filter id="Gaussian_Blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="3" />
</filter>
</defs>
<ellipse cx="200" cy="150" rx="70" ry="40"
style="fill:#ff0000;stroke:#000000;
stroke-width:2;filter:url(#Gaussian_Blur)"/>
</svg>

కోడ్ వివరణం:

  • <filter> టాగ్‌లో ఐడి అంశం ఫిల్టర్‌కు ఒక ప్రత్యేక పేరును నిర్వచిస్తుంది (ఒకే ఫిల్టర్ అనేక ఉపాంగాలకు వసతి ఉంటుంది)
  • filter:url అంశం వర్తనాన్ని సంబంధించిన ఉపాంగాన్ని సంబంధింపచేస్తుంది. ఫిల్టర్ ఐడి ని లింక్ చేయడానికి # అక్షరాన్ని వాడాలి
  • వర్తన ప్రభావాలు <feGaussianBlur> టాగ్ ద్వారా నిర్వచించబడతాయి. fe పొనులు అన్ని వర్తనాలకు వసతి ఉంటాయి
  • <feGaussianBlur> టాగ్‌లో స్టడ్‌డివియేషన్ అంశం మొదలు పడిన వర్తనం స్థాయిని నిర్వచిస్తుంది
  • in="SourceGraphic" ఈ భాగం మొత్తం చిత్రం ద్వారా సృష్టించబడిన ప్రభావాన్ని నిర్వచిస్తుంది

ఉదాహరణను చూడండి

మరొక స్టడ్‌డివియేషన్ విలువ వేర్వేరు ఉదాహరణ

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<defs>
<filter id="Gaussian_Blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="20"/>
</filter>
</defs>
<ellipse cx="200" cy="150" rx="70" ry="40"
style="fill:#ff0000;stroke:#000000;
stroke-width:2;filter:url(#Gaussian_Blur)"/>
</svg>

ఉదాహరణను చూడండి