【babylonjs】babylonjs实践（六）--材质的颜色

背景

材质是很重要的一课，网上的帖子写的都很差。我按我自己学习的方法写一次。

说明

材质就是物体的质感和触感，如不锈钢和布料的材质，质感和触感就是不一样的。在3D中，材质被赋到模型上。

材质的体验和光照关系比较大，光滑的表面，光照下特别明亮耀眼，如玻璃表面。粗糙的表面会显得暗淡，如地面。这些都是受光照的影响。

babylonjs材质的分类

按照材质对光线的反射的情况，可以将材质分为如下几类：

• 漫反射材质（Diffuse）—— 在光线下观察的材料的基本颜色或质地；
• 镜面材质，也叫高光（Specular）—— 光线给材质的亮点；
• 发光材质（Emissive）—— 发光材料的颜色或质地，如自发光；
• 环境材质（Ambient）—— 由环境背景光照明的材料的颜色或质地。

漫反射和镜面材料需要光源，如果没有光源，就不会发生反射，没有反射，就没有光进入人眼，所以对人来说，看不出什么区别。

环境颜色需要设置场景的环境颜色，提供环境背景照明。场景有一个环境光颜色属性（ambientColor），下面的代码给环境光赋值为白色。

正文

自发光材质（Emissive）

定义四种材质，

                var redMat = new BABYLON.StandardMaterial("redMat", scene);
                redMat.emissiveColor = new BABYLON.Color3(1, 0, 0);

                var greenMat = new BABYLON.StandardMaterial("greenMat", scene);
                greenMat.emissiveColor = new BABYLON.Color3(0, 1, 0);

                var blueMat = new BABYLON.StandardMaterial("blueMat", scene);
                blueMat.emissiveColor = new BABYLON.Color3(0, 0, 1);

                var whiteMat = new BABYLON.StandardMaterial("whiteMat", scene);
                whiteMat.emissiveColor = new BABYLON.Color3(1, 1, 1);

                var sphere = BABYLON.MeshBuilder.CreateSphere("sphere", {diameter: 0.25}, scene);
	            sphere.material = greenMat;

直接赋值就行，material = 某种材质。

漫反射材质

某个颜色的漫反射材质，只能在漫散射光下有颜色。

                redMat.diffuseColor = new BABYLON.Color3(1, 0, 0);

                var light = new BABYLON.PointLight("light2", new BABYLON.Vector3(0, 10, 0), scene);
                light.diffuse = new BABYLON.Color3(1, 0, 0);

                var sphere = BABYLON.MeshBuilder.CreateSphere("sphere", { diameter: 0.25 }, scene);
                sphere.material = redMat;

镜面材质

某个颜色的镜面反射材质，只能在镜面散射光下有颜色

                // 3333333
                // var redMat = new BABYLON.StandardMaterial("redMat", scene);
                // redMat.specularColor = new BABYLON.Color3(1, 0, 0);

                // var light = new BABYLON.PointLight("light2", new BABYLON.Vector3(0, 10, 0), scene);
                // light.specular = new BABYLON.Color3(1, 0, 0);

                // var sphere = BABYLON.MeshBuilder.CreateSphere("sphere", { diameter: 0.25 }, scene);
                // sphere.material = redMat;

环境材质

这个更容易理解，由环境光而定。

                var redMat = new BABYLON.StandardMaterial("redMat", scene);
                redMat.ambientColor = new BABYLON.Color3(1, 0, 0);

                scene.ambientColor = new BABYLON.Color3(1, 0, 0);

                var sphere = BABYLON.MeshBuilder.CreateSphere("sphere", { diameter: 0.25 }, scene);
                sphere.material = redMat;

正文2-纹理

下一节再讲