aframe
свет (компонент)
Поиск…
Вступление
Световой компонент определяет объект как источник света. Свет влияет на все материалы, которые не указали плоскую модель затенения с шейдером: плоский. Обратите внимание, что огни вычислительно дороги, мы должны ограничить количество огней в сцене.
Синтаксис
- <a-entity light = "color: #AFA; интенсивность: 1.5" position = "- 1 1 0"> </ a-entity>
- <a-light type = "point" color = "blue" position = "0 5 0"> </ a-light>
параметры
параметры | подробности |
---|---|
тип | Один из окружающего, направленного, полушария, точки, пятна. |
цвет | Светлый цвет. |
интенсивность | Прочность света. |
окружающий
Окружающие огни глобально влияют на все объекты сцены. Свойства цвета и интенсивности определяют окружающие огни. Кроме того, положение, вращение и масштаб не влияют на окружающие огни.
Мы рекомендуем иметь некоторый вид окружающего света, чтобы затененные области не были полностью черными и имитировали косвенное освещение.
<a-entity light="type: ambient; color: #CCC"></a-entity>
направленный
Направленные огни подобны источнику света, который находится бесконечно далеко, но сияет в определенном направлении, как солнце. Таким образом, абсолютная позиция не влияет на интенсивность света на объекте. Мы можем указать направление, используя компонент позиции.
В приведенном ниже примере создается источник света, светящийся от верхнего левого угла под углом 45 градусов. Обратите внимание, что, поскольку только вектор имеет значение, позиция = "- 100 100 0" и позиция = "- 1 1 0" одинаковы.
<a-entity light="type: directional; color: #EEE; intensity: 0.5" position="-1 1 0"></a-entity>
Мы можем указать направление направленного света с его ориентацией, создав дочерний объект, на который он нацелен. Например, указывая на свою ось -Z:
<a-light type="directional" position="0 0 0" rotation="-90 0 0" target="#directionaltarget">
<a-entity id="directionaltarget" position="0 0 -1"></a-entity>
</a-light>
полусфера
Свет в полушарии подобен окружающему свету, но с двумя разными цветами: один сверху (цвет) и один снизу (groundColor). Это может быть полезно для сцен с двумя различными цветами освещения (например, травянистое поле под серым небом).
<a-entity light="type: hemisphere; color: #33C; groundColor: #3C3; intensity: 2"></a-entity>
Имущество | Описание | Значение по умолчанию |
---|---|---|
groundColor | Светлый цвет снизу. | #fff |
точка
Точечные огни, в отличие от направленного света, ненаправленны и влияют на материалы в зависимости от их положения и расстояния. Точка любит, как лампочка. Чем ближе лампочка к объекту, тем больше объект горит.
<a-entity light="type: point; intensity: 0.75; distance: 50; decay: 2"
position="0 10 10"></a-entity>
Имущество | Описание | Значение по умолчанию |
---|---|---|
распад | Количество света уменьшается по расстоянию от света. | 1,0 |
расстояние | Расстояние, где интенсивность равна 0. Если расстояние равно 0, то точечный свет не распадается с расстоянием. | 0.0 |
Место
Точечные огни напоминают точечные огни в том смысле, что они влияют на материалы в зависимости от их положения и расстояния, но пятно света не всенаправлено. Они в основном бросают свет в одном направлении, как Бат-Сигнал.
<a-entity light="type: spot; angle: 45"></a-entity>
Имущество | Описание | Значение по умолчанию |
---|---|---|
угол | Максимальный размер пятна света от его направления (в градусах). | 60 |
распад | Количество света уменьшается по расстоянию от света. | 1,0 |
расстояние | Расстояние, где интенсивность равна 0. Если расстояние равно 0, то точечный свет не распадается с расстоянием. | 0.0 |
полутень | Процент конуса прожектора, который ослабляется из-за полутени. | 0.0 |
цель | элемент, на который указывает точка. установите значение null, чтобы преобразовать прожектор по ориентации, указывая на ось -Z. | ноль |
Освещение по умолчанию
По умолчанию в сценах A-Frame вводятся освещение по умолчанию, окружающий свет и направленный свет. Эти индикаторы по умолчанию отображаются в DOM с атрибутом data-aframe-default-light. Всякий раз, когда мы добавляем какие-либо огни, A-Frame удаляет огни по умолчанию из сцены.
<!-- Default lighting injected by A-Frame. -->
<a-entity light="type: ambient; color: #BBB"></a-entity>
<a-entity light="type: directional; color: #FFF; intensity: 0.6" position="-0.5 1 1"></a-entity>