baseFrequency
Baseline
åºãå©ç¨å¯è½
ãã®æ©è½ã¯åºãå®è£ ããã¦ãããå¤ãã®ãã¼ã¸ã§ã³ã®ç«¯æ«ããã©ã¦ã¶ã¼ã§åä½ãã¾ãã2015å¹´7æä»¥éããã¹ã¦ã®ãã©ã¦ã¶ã¼ã§å©ç¨å¯è½ã§ãã
baseFrequency 屿§ã¯ã<feTurbulence> ãã£ã«ã¿ã¼ããªããã£ãã®ãã¤ãºé¢æ°ã«ãããåºæ¬å¨æ³¢æ°ãã©ã¡ã¼ã¿ã¼ã表ãã¾ãã
ãã®å±æ§ã¯ã次㮠SVG è¦ç´ ã§ä½¿ç¨ãããã¨ãã§ãã¾ãã
ä¾
>ä¾ 1
html
<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
<filter id="noise1" x="0" y="0" width="100%" height="100%">
<feTurbulence baseFrequency="0.025" />
</filter>
<filter id="noise2" x="0" y="0" width="100%" height="100%">
<feTurbulence baseFrequency="0.05" />
</filter>
<rect x="0" y="0" width="200" height="200" filter="url(#noise1)" />
<rect x="220" y="0" width="200" height="200" filter="url(#noise2)" />
</svg>
ä¾ 2
html
<svg
width="200"
height="200"
viewBox="0 0 220 220"
xmlns="http://www.w3.org/2000/svg">
<filter id="displacementFilter">
<feTurbulence
type="turbulence"
baseFrequency="0.05"
numOctaves="2"
result="turbulence" />
<feDisplacementMap
in2="turbulence"
in="SourceGraphic"
scale="50"
xChannelSelector="R"
yChannelSelector="G" />
</filter>
<circle cx="100" cy="100" r="100" filter="url(#displacementFilter)" />
</svg>
使ç¨ä¸ã®ã¡ã¢
| å¤ | <number-optional-number> |
|---|---|
| ããã©ã«ãå¤ | 0 |
| ã¢ãã¡ã¼ã·ã§ã³ | å¯ |
<number-optional-number>-
2 ã¤ã®æ°å¤ãæä¾ãããå ´åã1 ã¤ç®ã¯æ°´å¹³æ¹åã®åºæ¬å¨æ³¢æ°ãã2 ã¤ç®ã¯åç´æ¹åã®åºæ¬å¨æ³¢æ°ã表ãã¾ãã1 ã¤ã®æ°å¤ãæå®ãããå ´åã¯ããã®å¤ã x 軸㨠y 軸ã®ä¸¡æ¹ã«ä½¿ç¨ããã¾ãã
è² ã®å¤ã¯ä½¿ç¨ã§ãã¾ããã
仿§æ¸
| 仿§æ¸ |
|---|
| Filter Effects Module Level 1 > # element-attrdef-feturbulence-basefrequency > |