limitingConeAngle
Атрибут limitingConeAngle представляет собой угол в градусах между осью прожектора (т. е. осью между источником света и точкой, на которую он направлен) и конусом прожектора. Таким образом, он определяет предельный конус, который ограничивает область, где проецируется свет. Свет не проецируется за пределами конуса.
Вы можете использовать этот атрибут со следующими элементами SVG:
Пример
html
<svg viewBox="0 0 480 200" xmlns="http://www.w3.org/2000/svg"> <filter id="spotLight1" x="0" y="0" width="100%" height="100%"> <feDiffuseLighting diffuseConstant="2"> <feSpotLight x="10" y="10" z="50" pointsAtX="100" pointsAtY="100" limitingConeAngle="10" /> </feDiffuseLighting> </filter> <filter id="spotLight2" x="0" y="0" width="100%" height="100%"> <feDiffuseLighting diffuseConstant="2"> <feSpotLight x="10" y="10" z="50" pointsAtX="100" pointsAtY="100" limitingConeAngle="40" /> </feDiffuseLighting> </filter> <rect x="0" y="0" width="200" height="200" style="filter: url(#spotLight1);" /> <rect x="0" y="0" width="200" height="200" style="filter: url(#spotLight2); transform: translateX(220px);" /> </svg>
Примечания к использованию
| Значение | <number> |
|---|---|
| Значение по умолчанию | 0 |
| Анимируемо | Да |
Спецификации
Совместимость с браузерами
| Рабочий стол | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на iOS | Samsung Internet | WebView Android | |
limitingConeAngle |
5 | 12 | 3 | 9 | 6 | 18 | 4 | 10.1 | 6 | 1.0 | 4.4 |
© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/limitingConeAngle