p5.js | Función ambientLight()

La función ambientLight() en p5.js se usa para crear una luz ambiental con el color especificado. La luz ambiental no tiene ninguna fuente en particular. Viene de todas partes del lienzo e ilumina los objetos de manera uniforme.

Sintaxis:

ambientLight( v1, v2, v3, [alpha] )

ambientLight( value )

ambientLight( gray, [alpha] )

ambientLight( values )

ambientLight( color )

Parámetros: Esta función acepta ocho parámetros como se mencionó anteriormente y se describe a continuación:

v1: Es un número que determina el valor de rojo o matiz relativo a la gama de colores actual.
v2: Es un número que determina el valor de verde o de saturación relativo a la gama de colores actual.
v3: Es un número que determina el valor de azul o brillo relativo a la gama de colores actual.
alfa: Es un número que determina el valor alfa del color.
valor: Es una string que define el color de la luz ambiental.
gris: Es un número que define el valor de gris de la luz ambiental.
valores: Es una array de números que definen los componentes rojo, verde, azul y alfa del color de la luz ambiental.
color: Es un p5.Color que define el color de la luz ambiental.

Los siguientes ejemplos ilustran la función ambientLight() en p5.js:

Ejemplo 1:

let newFont;
let pointLightEnable = false;
  
function preload() {
  newFont = loadFont('fonts/Montserrat.otf');
}
  
function setup() {
  createCanvas(600, 300, WEBGL);
  textFont(newFont, 18);
  
  graySlider = createSlider(0, 128, 64, 1);
  graySlider.position(20, 50);
  
  pointLightCheck = createCheckbox(
       "Enable Point Light", false);
  
  pointLightCheck.position(20, 80);
  
  // Toggle point light
  pointLightCheck.changed(() => {
    pointLightEnable = !pointLightEnable;
  });
}
  
function draw() {
  background("green");
  text("Move the slider to change the ambient"
        + " light's red value.", -285, -125);
  noStroke();
  shininess(15);
  if (pointLightEnable) {
    pointLight(0, 0, 255, -width / 2,
                    -height / 2, 250);
  }
  
  grayValue = graySlider.value();
  ambientLight(grayValue, 0, 0);
  specularMaterial(250);
  sphere(100);
}

Producción:
valor rojo

Ejemplo 2:

let newFont;
let pointLightEnable = false;
  
function preload() {
  newFont = loadFont('fonts/Montserrat.otf');
}
  
function setup() {
  createCanvas(600, 300, WEBGL);
  textFont(newFont, 18);
  
  graySlider = createSlider(0, 128, 64, 1);
  graySlider.position(20, 50);
  
  pointLightCheck = createCheckbox(
        "Enable Point Light", false);
  
  pointLightCheck.position(20, 80);
  
  // Toggle point light
  pointLightCheck.changed(() => {
    pointLightEnable = !pointLightEnable;
  });
}
  
function draw() {
  background("green");
  text("Move the slider to change the ambient"
      + " light's gray value.", -285, -125);
  noStroke();
  shininess(15);
  if (pointLightEnable) {
    pointLight(255, 0, 0, -width / 2,
                    -height / 2, 250);
  }
  
  grayValue = graySlider.value();
  ambientLight(grayValue);
  specularMaterial(250);
  sphere(100);
}

Producción:
valor gris