p5.js | specularColor()函数

p5.js 中的specularColor()函数用于在与高光材质和高光一起使用时设置高光的颜色。

此方法通常与 specularMaterial() 和 shininess() 函数一起使用来定义镜面高光。如果没有 specularMaterial()函数，这个函数就没有效果。如果不使用此函数，则默认的镜面高光颜色为白色。

句法：

specularColor( v1, v2, v3 )

或者

specularColor( value )

或者

specularColor( gray )

或者

specularColor( values )

或者

specularColor( color )

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

• v1：它是一个数字，用于确定相对于当前颜色范围的红色或色调值。
• v2：它是一个数字，用于确定相对于当前颜色范围的绿色或饱和度值。
• v3：它是一个数字，用于确定相对于当前颜色范围的蓝色或亮度值。
• value：它是一个定义镜面高光颜色的字符串。
• gray：它是一个数字，用于定义镜面高光的灰度值。
• values：它是一个数字数组，定义了高光高光颜色的红色、绿色、蓝色和 alpha 分量。
• color：它是一个 p5.Color，它定义了镜面高光的颜色。

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

例子：

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);
}

输出：

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

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

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