p5.js | Función especularColor()

La función specularColor() en p5.js se usa para establecer el color del resaltado especular cuando se usa con el material especular y el resaltado.

Este método generalmente se usa con las funciones specularMaterial() y shininess() para definir los reflejos especulares. No habría ningún efecto de esta función sin la función specularMaterial(). El color de resaltado especular predeterminado es blanco, si no se utiliza esta función.

Sintaxis:

specularColor( v1, v2, v3 )

O

specularColor( value )

O

specularColor( gray )

O

specularColor( values )

O

specularColor( color )

Parámetros: esta función acepta siete 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.
• valor: Es una string que define el color de resaltado especular.
• gris: Es un número que define el valor de gris del resaltado especular.
• valores: Es una array de números que definen los componentes rojo, verde, azul y alfa del color de resaltado especular.
• color: Es un p5.Color que define el color del resaltado especular.

El siguiente ejemplo ilustra la función specularColor() en p5.js:

Ejemplo:

let newFont;
  
function preload() {
  newFont = loadFont('fonts/Montserrat.otf');
}
  
function setup() {
  createCanvas(600, 300, WEBGL);
  textFont(newFont, 18);
  
  redColorSlider = createSlider(0, 255, 128, 1);
  redColorSlider.position(20, 50);
  
  blueColorSlider = createSlider(0, 255, 128, 1);
  blueColorSlider.position(20, 80);
}
  
function draw() {
  background('green');
  text("Move the sliders to change the red and"
    + " blue specular highlights", -285, -125);
  noStroke();
  shininess(15);
  
  redSpecularIntensity = redColorSlider.value();
  blueSpecularIntensity = blueColorSlider.value();
  
  specularColor(redSpecularIntensity, 0, 0);
  pointLight(255, 0, 0, -width / 2, -height / 2, 250);
  specularColor(0, 0, blueSpecularIntensity);
  pointLight(0, 0, 255, width / 2, height / 2, 250);
  
  specularMaterial(250);
  sphere(100);
}

Producción:

Editor en línea: https://editor.p5js.org/

Configuración del entorno: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

Referencia: https://p5js.org/reference/#/p5/specularColor