Common material selection material

var material = new THREE.MeshBasicMaterial({
  color: 0xdd00ff,
  // 前面FrontSide  背面:BackSide 双面:DoubleSide
  side:THREE.DoubleSide,
});

1 Common material: MeshLambertMaterial, not affected by light

var cubeGeometry = new THREE.BoxGeometry(1, 1, 1);
var cubeMaterial = new THREE.MeshLambertMaterial({ color: 0xff0000,opacity:0.5,transparent:true });
cube = new THREE.Mesh(cubeGeometry, cubeMaterial);    //物体=几何体+材质

2 Normal vector material MeshNormalMaterial, the color of each surface is different

 var cubeGeometry2 = new THREE.BoxGeometry(1, 1, 1);
 var cubeMaterial2 = new THREE.MeshNormalMaterial({flatShading: true});
 cube2 = new THREE.Mesh(cubeGeometry2, cubeMaterial2); 

3 Specular material: you can create a shiny material

Attribute name description Remarks
color The color of the material, the default is white Commonly used
shininess Smoothness, specify the brightness of the highlight part, the default value is 30 Commonly used
specular The color of the highlight part of the material. The default value is 0x111111 dark gray. If you set its color to be the same as the color color, you will get a metal-like material. If you set it to gray, it looks more like plastic  
ambient This is the ambient color of the material. It is used together with the ambient light source discussed in the previous chapter. This color will be multiplied by the color provided by the ambient light source. The default value is white  
emissive This is the color emitted by the material. It does not actually want to be a light source, but a pure color that is not affected by other lights. The default value is black.  
metal If this property is set to true, Three.js will calculate the color of the pixel in a slightly different way to make the object look more like metal. It should be noted that this effect is very small  
wrapAround If this property is set to true, semi-lambert lighting technology is started. With it, the light drops more subtle. If the grid has rough, dark areas, the shadows will become softer and more evenly distributed when this attribute is enabled  
wrapRGB When the wrapAround property is set to true, you can use THREE.Vector3 to control the speed of light falling

 var cubeGeometry2 = new THREE.BoxGeometry(1, 1, 1);        
 var cubeMaterial2 = new THREE.MeshPhongMaterial({color: 0x836DED,specular:0x111111,shininess:80});
  cube2 = new THREE.Mesh(cubeGeometry2, cubeMaterial2); 

                    

 

Guess you like

Origin blog.csdn.net/sichuanpb/article/details/110754780