<feSpecularLighting>

Baseline 廣泛可用 *

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

* 此特性的某些部分可能存在不同級別的支援。

<feSpecularLighting> SVG 濾鏡基元使用 Alpha 通道作為凹凸貼圖來照亮源圖形。生成的影像是基於光線顏色的 RGBA 影像。光照計算遵循 Phong 光照模型的標準鏡面反射分量。生成的影像取決於光線顏色、光線位置以及輸入凹凸貼圖的表面幾何形狀。光照計算的結果會被累加。濾鏡基元假定觀察者在 z 方向的無窮遠處。

此濾鏡基元會生成包含光照計算中鏡面反射部分的影像。此類貼圖旨在與使用算術 <feComposite> 方法的 add 項結合使用。可以透過在將其應用於紋理影像之前新增多個這樣的光照貼圖來模擬多個光源。

與其它濾鏡圖元一樣,它預設在 linearRGB 顏色空間中處理顏色分量。您可以使用 color-interpolation-filters 屬性改為使用 sRGB

使用語境

分類濾鏡圖元元素
允許內容首先是且僅是 1 個 光源元素,然後可以按任意順序包含任意數量的 描述性元素

屬性

DOM 介面

此元素實現了 SVGFESpecularLightingElement 介面。

示例

html
<svg
  height="200"
  width="200"
  viewBox="0 0 220 220"
  xmlns="http://www.w3.org/2000/svg">
  <filter id="filter">
    <feSpecularLighting
      result="specOut"
      specularExponent="20"
      lighting-color="#bbbbbb">
      <fePointLight x="50" y="75" z="200" />
    </feSpecularLighting>
    <feComposite
      in="SourceGraphic"
      in2="specOut"
      operator="arithmetic"
      k1="0"
      k2="1"
      k3="1"
      k4="0" />
  </filter>
  <circle cx="110" cy="110" r="100" filter="url(#filter)" />
</svg>

結果

規範

規範
濾鏡效果模組第 1 級
# feSpecularLightingElement

瀏覽器相容性

另見