<feTurbulence>
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Primitive bộ lọc SVG <feTurbulence> tạo ra một hình ảnh bằng hàm nhiễu Perlin. Nó cho phép tổng hợp các kết cấu nhân tạo như mây hoặc đá cẩm thạch. Hình ảnh thu được sẽ lấp đầy toàn bộ vùng con của primitive bộ lọc.
Giống như các primitive bộ lọc khác, nó xử lý các thành phần màu trong không gian màu linearRGB theo mặc định. Bạn có thể dùng color-interpolation-filters để dùng sRGB thay thế.
Ngữ cảnh sử dụng
Thuộc tính
Giao diện DOM
Phần tử này triển khai giao diện SVGFETurbulenceElement.
Ví dụ
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>
Thông số kỹ thuật
| Specification |
|---|
| Filter Effects Module Level 1 # feTurbulenceElement |
Khả năng tương thích trình duyệt
Xem thêm
- Thuộc tính primitive bộ lọc SVG, bao gồm
result. <filter><animate><set><feBlend><feColorMatrix><feComponentTransfer><feComposite><feConvolveMatrix><feDiffuseLighting><feDisplacementMap><feFlood><feGaussianBlur><feImage><feMerge><feMorphology><feOffset><feSpecularLighting><feTile>- Hướng dẫn SVG: Hiệu ứng bộ lọc