p5.js | specularMaterial()函数

p5.js 中的specularMaterial()函数用于为具有给定颜色的几何体创建镜面反射材质。镜面反射材料是一种有光泽的反射材料。它还定义了对象将反射的颜色。如果镜面反射材质设置为只反射红色，那么它将只反射红色，否则物体不会反射任何其他颜色的光。

句法：

specularMaterial( v1, [v2], [v3] )

或者

specularMaterial( color )

参数：此函数接受上面提到的四个参数，如下所述：

• v1：它是一个数字，它决定了灰度值，或者相对于当前颜色范围的红色或色调值。
• v2：它是一个数字，用于确定相对于当前颜色范围的绿色或饱和度值。它是一个可选参数。
• v3：它是一个数字，用于确定相对于当前颜色范围的蓝色或亮度值。它是一个可选参数。
• color：它是一个 p5.Color 或颜色字符串，用于定义高光材质的颜色。

下面的示例说明了 p5.js 中的directionalLight()函数：

例子：

let newFont;
let currentLightColor = "red";
let currentSpecularColor = "red";
  
function preload() {
  newFont = loadFont('fonts/Montserrat.otf');
}
  
function setup() {
  createCanvas(600, 300, WEBGL);
  textFont(newFont, 16);
  
  materialColorSel = createSelect();
  materialColorSel.position(30, 70);
  materialColorSel.option('red');
  materialColorSel.option('green');
  materialColorSel.option('blue');
  materialColorSel.changed(() => {
    currentSpecularColor = materialColorSel.value();
  });
  
  lightColorSel = createSelect();
  lightColorSel.position(30, 120);
  lightColorSel.option('red');
  lightColorSel.option('green');
  lightColorSel.option('blue');
  lightColorSel.changed(() => {
    currentLightColor = lightColorSel.value();
  });
}
  
function draw() {
  background('white');
  fill('black');
  
  text("Select an option below to set the light"
     + " and specular material color", -285, -125);
  text("Select directional light color", -285, -100);
  text("Select specular material color", -285, -50);
  shininess(10);
  noStroke();
  
  // Set the specular material to the selected color
  specularMaterial(currentSpecularColor);
  
  // Set the directional to the selected color
  directionalLight(color(currentLightColor), 
               height / 2, width / 2, -250);
  
  // Draw the sphere
  translate(100, 0, 0);
  sphere(100);
  translate(-100, 0, 0);
}

输出：

在线编辑器： https://editor.p5js.org/

环境设置： https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

参考： https://p5js.org/reference/#/p5/specularMaterial