本文概述
<feTurbulence>元素用于用新内容填充矩形。它使你可以产生人造纹理, 以产生大理石, 云朵等效果。
它具有五个特定属性：
- 类型
- numOctaves
- 种子
- 基本频率
- itchTiles。
类型
<feTurbulence>元素具有两个类型的值：turbulence和fractalNoise。湍流显得更加严格, 而分形噪声则显得更加模糊。类型的默认值为湍流。
例子
<!DOCTYPE html>
<html>
<body>
<svg height="900" width="900">
<filter id="T2">
<feTurbulence baseFrequency=".06" type="fractalNoise"/>
</filter>
<rect x="30" y="10" height="100" width="100" filter="url(#T2)"/>
</svg>
</body>
</html>立即测试
numOctaves
生成最终结果时应加在一起的噪声函数数。
其默认值为1。该数字越大表示纹理越细。
例子
<!DOCTYPE html>
<html>
<body>
<svg height="900" width="900">
<filter id="T2">
<feTurbulence baseFrequency=".04" numOctaves="1" />
</filter>
<rect x="80" y="40" height="150" width="150" filter="url(#T2)"/>
</svg>
</body>
</html>立即测试
种子
<feTurbulence>接受一个种子值, 该值允许从实例到实例生成具有相同特征的不同场景。
其默认值为零。
例子
<!DOCTYPE html>
<html>
<body>
<svg height="900" width="900">
<filter id="T2">
<feTurbulence baseFrequency=".02" seed="15" />
</filter>
<rect x="30" y="10" height="100" width="100" filter="url(#T2)"/>
</svg>
</body>
</html>立即测试
基本频率
baseFrequency用于控制噪声的大小或频率。 baseFrequency的值必须大于零且小于一。
此属性有两个数字。第一个数字表示x方向的频率, 第二个数字表示y方向的频率。
例子
<!DOCTYPE html>
<html>
<body>
<svg height="900" width="900">
<filter id="T1">
<feTurbulence baseFrequency=".06"/>
</filter>
<rect x="30" y="10" height="100" width="100" filter="url(#T1)"/>
</svg>
</body>
</html>立即测试
