SVG FESpotLightElement.y 属性

SVG FESpotLightElement 是 SVG 中的一个元素，用于创建一个聚光灯效果。其中，属性 y 用于定义聚光灯的方向向量在 y 轴上的分量。

属性值

y 属性接受一个数字值，表示聚光灯方向向量在 y 轴上的分量。值可以是正数、负数或零。默认值为 0。

使用方法

可以使用 setAttribute() 方法或直接在 SVG 源文件中设置 FESpotLightElement 的属性来定义一个聚光灯。下面是一个示例代码：

<svg>
  <filter id="spotlight">
    <feSpotLight x="50%" y="50%" z="100" specularExponent="50" limitingConeAngle="30">
      <fePointLight x="-10%" y="-10%" z="35"/>
    </feSpotLight>
  </filter>
  <rect x="50" y="50" width="90" height="90" fill="#009900" filter="url(#spotlight)" />
</svg>

通过设置 FESpotLightElement 的 y 属性，可以改变聚光灯的方向向量在 y 轴上的分量。下面是一个示例代码：

const spotlight = document.querySelector('#spotlight');
spotlight.setAttribute('y', '-1');

兼容性

各浏览器对于 FESpotLightElement 的支持度略有不同，下面是各浏览器的支持情况：

• Chrome：支持
• Firefox：支持
• Safari：支持
• Edge：支持
• Internet Explorer：不支持

参考链接

• FESpotLightElement