SVG FETurbulenceElement.baseFrequencyY 属性

SVG FETurbulenceElement.baseFrequencyY 属性表示垂直方向上的噪声基频。该属性用于定义噪声单元的初始密度，决定了噪声的颗粒度和颜色的过渡效果。

语法

<feTurbulence baseFrequencyY="value"></feTurbulence>

其中 value 表示垂直方向上的噪声基频的值，可以是以下类型：

• 长度值
• 百分比值
• 省略值

如果是长度值或百分比值，则该值与图像的尺寸有关，如果是省略值，则将默认跟随 baseFrequencyX 属性的值。

属性值

• value：表示垂直方向上的噪声基频的值，取值范围为 0~∞。默认值为 0。

示例

<svg width="300" height="200">
  <filter id="turbulence">
    <feTurbulence baseFrequencyX="0.02" baseFrequencyY="0.1"></feTurbulence>
    <feColorMatrix type="hueRotate" values="180"></feColorMatrix>
  </filter>
  <rect x="50" y="50" width="200" height="100" fill="none" stroke="black" filter="url(#turbulence)"></rect>
</svg>

效果如下：

代码解释：

• baseFrequencyX="0.02"：垂直方向上噪声的初始密度为 0.02。
• baseFrequencyY="0.1"：水平方向上噪声的初始密度为 0.1。
• type="hueRotate" values="180"：通过色相旋转将图像颜色反转 180 度。
• filter="url(#turbulence)"：将该滤镜应用到矩形上。

注意事项

• baseFrequencyY 属性只对 <feTurbulence> 元素起作用。
• baseFrequencyY 属性通常与 baseFrequencyX 属性一起使用，两者一起决定了噪声的密度。
• baseFrequencyY 属性可以通过 JavaScript 动态修改。