aframe
luz (componente)
Buscar..
Introducción
El componente de luz define la entidad como una fuente de luz. La luz afecta a todos los materiales que no han especificado un modelo de sombreado plano con sombreador: plano. Tenga en cuenta que las luces son computacionalmente caras, debemos limitar el número de luces en una escena.
Sintaxis
- <a-entity light = "color: #AFA; intensidad: 1.5" position = "- 1 1 0"> </a-entity>
- <a-light type = "point" color = "blue" position = "0 5 0"> </a-light>
Parámetros
| Parámetros | Detalles |
|---|---|
| tipo | Uno de ambiente, direccional, hemisferio, punto, mancha. |
| color | Color claro. |
| intensidad | Fuerza de la luz. |
Ambiente
Las luces ambientales afectan globalmente a todas las entidades en la escena. Las propiedades de color e intensidad definen las luces ambientales. Además, la posición, la rotación y la escala no tienen efecto en las luces ambientales.
Recomendamos tener algún tipo de luz ambiental tal que las áreas sombreadas no sean completamente negras e imitar la iluminación indirecta.
<a-entity light="type: ambient; color: #CCC"></a-entity>
Direccional
Las luces direccionales son como una fuente de luz que está infinitamente lejos, pero que brilla desde una dirección específica, como el sol. Por lo tanto, la posición absoluta no tiene un efecto sobre la intensidad de la luz en una entidad. Podemos especificar la dirección usando el componente de posición.
El siguiente ejemplo crea una fuente de luz que brilla desde la parte superior izquierda en un ángulo de 45 grados. Tenga en cuenta que como solo importa el vector, la posición = "- 100 100 0" y la posición = "- 1 1 0" son iguales.
<a-entity light="type: directional; color: #EEE; intensity: 0.5" position="-1 1 0"></a-entity>
Podemos especificar la dirección de la luz direccional con su orientación creando una entidad secundaria a la que se dirige. Por ejemplo, apuntando hacia abajo su eje -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>
Hemisferio
Las luces del hemisferio son como una luz ambiental, pero con dos colores diferentes, uno desde arriba (color) y otro desde abajo (color de fondo). Esto puede ser útil para escenas con dos colores de iluminación distintos (por ejemplo, un campo de hierba bajo un cielo gris).
<a-entity light="type: hemisphere; color: #33C; groundColor: #3C3; intensity: 2"></a-entity>
| Propiedad | Descripción | Valor por defecto |
|---|---|---|
| color de fondo | Color claro desde abajo. | #fff |
Punto
Las luces puntuales, a diferencia de las luces direccionales, son omnidireccionales y afectan a los materiales dependiendo de su posición y distancia. Los "me gusta" son como una bombilla. Cuanto más se acerca la bombilla a un objeto, mayor es la iluminación del objeto.
<a-entity light="type: point; intensity: 0.75; distance: 50; decay: 2"
position="0 10 10"></a-entity>
| Propiedad | Descripción | Valor por defecto |
|---|---|---|
| decaer | La cantidad de luz se atenúa a lo largo de la distancia de la luz. | 1.0 |
| distancia | Distancia donde la intensidad se convierte en 0. Si la distancia es 0, entonces la luz del punto no decae con la distancia. | 0.0 |
Lugar
Las luces puntuales son como luces puntuales en el sentido de que afectan a los materiales dependiendo de su posición y distancia, pero las luces puntuales no son omnidireccionales. Principalmente arrojan luz en una dirección, como la Bat-Signal.
<a-entity light="type: spot; angle: 45"></a-entity>
| Propiedad | Descripción | Valor por defecto |
|---|---|---|
| ángulo | Máxima extensión de la luz puntual desde su dirección (en grados). | 60 |
| decaer | La cantidad de luz se atenúa a lo largo de la distancia de la luz. | 1.0 |
| distancia | Distancia donde la intensidad se convierte en 0. Si la distancia es 0, entonces la luz del punto no decae con la distancia. | 0.0 |
| penumbra | Porcentaje del cono de foco que se atenúa debido a la penumbra. | 0.0 |
| objetivo | elemento que el punto debe señalar. configúrelo en nulo para transformar el foco por orientación, apuntando a su eje -Z. | nulo |
Iluminación por defecto
Por defecto, las escenas de fotograma A inyectan iluminación predeterminada, una luz ambiental y una luz direccional. Estas luces predeterminadas son visibles en el DOM con el atributo data-aframe-default-light. Cada vez que agregamos luces, A-Frame elimina las luces predeterminadas de la escena.
<!-- 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>