SVGFEGaussianBlurElement:setStdDeviation() 方法
SVGFEGaussianBlurElement 介面的 setStdDeviation() 方法用於設定 stdDeviation 屬性的值。
語法
js
setStdDeviation(x, y)
引數
返回值
無(undefined)。
示例
使用 setStdDeviation()
html
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<defs>
<filter id="gaussian-blur-filter">
<feGaussianBlur
in="SourceGraphic"
stdDeviation="5 5"
result="blurred-graphic" />
</filter>
</defs>
<!-- Rectangle with an initial blur effect -->
<rect
x="50"
y="50"
width="100"
height="100"
fill="hotpink"
filter="url(#gaussian-blur-filter)" />
</svg>
<!-- Button to update the blur -->
<button id="updateBlur">Update Blur</button>
js
// Get the feGaussianBlur element
const gaussianBlur = document.querySelector("feGaussianBlur");
// Button to trigger the update
document.getElementById("updateBlur").addEventListener("click", () => {
// Change the standard deviation (blur radius) of the blur effect
gaussianBlur.setStdDeviation(15, 20); // Update to X: 15, Y: 20
});
規範
| 規範 |
|---|
| 濾鏡效果模組第 1 級 # dom-svgfegaussianblurelement-setstddeviation |
瀏覽器相容性
載入中…