pointsAtY
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年7月以降、すべてのブラウザーで利用可能です。
pointsAtY 属性は、<filter> 要素の primitiveUnits 属性によって定義された座標系における、光源が指し示す点の Y 座標を表します。
この属性は以下の SVG 要素で使用できます。
例
html
<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
<filter id="lighting1" x="0" y="0" width="100%" height="100%">
<feDiffuseLighting in="SourceGraphic">
<feSpotLight x="60" y="60" z="50" pointsAtY="0" />
</feDiffuseLighting>
</filter>
<filter id="lighting2" x="0" y="0" width="100%" height="100%">
<feDiffuseLighting in="SourceGraphic">
<feSpotLight x="60" y="60" z="50" pointsAtY="400" />
</feDiffuseLighting>
</filter>
<rect x="0" y="0" width="200" height="200" filter="url(#lighting1)" />
<rect x="220" y="0" width="200" height="200" filter="url(#lighting2)" />
</svg>
使用上のメモ
| デフォルト値 | 0 |
|---|---|
| 値 | <number> |
| アニメーション | 可 |
仕様書
| 仕様書 |
|---|
| Filter Effects Module Level 1 # element-attrdef-fespotlight-pointsaty |