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

输出：
specularmat-options

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

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

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

相关用法

注：本文由纯净天空筛选整理自sayantanm19大神的英文原创作品 p5.js | specularMaterial() Function。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。