baseFrequency

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.

Thuộc tính baseFrequency đại diện cho tham số tần số cơ sở của hàm nhiễu cho primitive lọc <feTurbulence>.

Bạn có thể dùng thuộc tính này với phần tử SVG sau:

<feTurbulence>

Ví dụ

Ví dụ 1

html,
body,
svg {
  height: 100%;
}

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>

Ví dụ 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>

Giá trị	<number-optional-number>
Giá trị mặc định	`0`
Có thể animate	Có

Nếu cung cấp hai số, số thứ nhất đại diện cho tần số cơ sở theo hướng ngang và số thứ hai đại diện cho tần số cơ sở theo hướng dọc. Nếu chỉ cung cấp một số, giá trị đó sẽ được dùng cho cả trục x và y.

Giá trị âm không được phép.