物料

物料
进一步阅读

物料

材料允许您在颜色和纹理上覆盖网格，并且需要光线才能看到。一种材料可用于覆盖任意数量的网格。

对光的反应

无论材料是颜色还是纹理，它都有不同的反应方式。

漫反射 - 在光线下观察的材料的基本颜色或纹理;
高光 - 光线给材料的亮点;
自发光 - 材料的颜色或纹理，就像自亮一样;
环境 - 由环境背景照明点亮的材料的颜色或纹理。

漫反射和镜面反射材质需要创建光源。环境颜色需要设置场景的环境颜色，从而提供环境背景照明。

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

透明度 - 可以设置您可以通过材质看到的级别，对于具有透明部分的图像，可以使用它以使材料的适当部分不可见。这需要设置alpha属性。

颜色

使用创建材料

var myMaterial = new BABYLON.StandardMaterial("myMaterial", scene);

使用diffuseColor，specularColor，emissiveColor和ambientColor中的一个，部分或全部设置材质颜色。请记住，ambientColor 仅在已设置场景环境颜色时才适用。

var myMaterial = new BABYLON.StandardMaterial("myMaterial", scene);

myMaterial.diffuseColor = new BABYLON.Color3(1, 0, 1);
myMaterial.specularColor = new BABYLON.Color3(0.5, 0.6, 0.87);
myMaterial.emissiveColor = new BABYLON.Color3(1, 1, 1);
myMaterial.ambientColor = new BABYLON.Color3(0.23, 0.98, 0.53);

mesh.material = myMaterial;

漫反射颜色示例

为了了解材料漫反射颜色如何对漫反射光颜色作出反应，下面的游乐场示例显示了不同的颜色材料如何对白色，红色，绿色和蓝色漫射光反应。

游乐场示例 - 材质颜色对光色的反应直接点击或编辑以查看 -

这种反应


黄色材料	紫色材料
青色材料	白色材料

在下图中还可以看到白色，红色，绿色和蓝色漫反射光。

Spot Light

环境颜色示例

在这个游乐场的例子 -

所有球体都被相同的半球光照亮，漫射的红色和地面颜色为绿色。第一个球体没有环境颜色，中间部分在其材料上定义了红色环境颜色，而右边一个球体具有绿色环境颜色的材料。必须存在的场景环境颜色是白色。当场景环境颜色分量设置为0（例如红色）时，无论材质环境颜色中的红色值如何都不起作用。

Ambient

透明颜色示例

通过将材质alpha属性从0（不可见）设置为1（不透明）来实现透明度。

myMaterial.alpha = 0.5;

游乐场示例透明度 -

质地

使用保存的图像形成纹理。

使用创建材料

var myMaterial = new BABYLON.StandardMaterial("myMaterial", scene);

使用diffuseTexture，specularTexture，emissiveTexture和ambientTexture中的一个，部分或全部设置材质。请注意，应用ambientTexture时未设置场景环境颜色。

var myMaterial = new BABYLON.StandardMaterial("myMaterial", scene);

myMaterial.diffuseTexture = new BABYLON.Texture("PATH TO IMAGE", scene);
myMaterial.specularTexture = new BABYLON.Texture("PATH TO IMAGE", scene);
myMaterial.emissiveTexture = new BABYLON.Texture("PATH TO IMAGE", scene);
myMaterial.ambientTexture = new BABYLON.Texture("PATH TO IMAGE", scene);

mesh.material = myMaterial;

注意：如果未指定法线，Babylon的标准材料将计算法线。

纹理示例

在这个游乐场的例子 -

所有球体都被相同的半球光照亮，漫射的红色和地面颜色为绿色。第一个球体具有漫反射纹理，中间是发光纹理，右侧是具有红色漫反射颜色和环境纹理的材质。

Texture

透明纹理示例

对于颜色，透明度是通过将材质alpha属性从0（不可见）设置为1（不透明）来实现的。

myMaterial.alpha = 0.5;

游乐场示例透明度 -

此外，用于纹理的图像可能已经具有透明度设置，例如来自维基媒体公域的狗的图片，其具有透明背景;

A dog

在这种情况下，我们将纹理的hasAlpha属性设置为true

myMaterial.diffuseTexture.hasAlpha = true;

游乐场示例透明背景 -

为了通过正面的透明区域可以看到立方体的背面，我们必须处理背面剔除。

背面剔除

这是用于有效地绘制3D模型的2D屏幕渲染的方法。通常不需要绘制立方体或其他物体的背面，因为它将被正面隐藏。在BabylonJS中，默认设置是，如您所料，设置为true。

查看下面的图像，当材料属性backFaceCulling为true时，您可以看到狗周围的透明区域仍然是透明的，您可以通过它们看到背景。但是，您无法看到背面上的图像，因为它们已被剔除（或移除）。当backFaceCulling为false时，在渲染过程中不会移除背面，因此可以通过正面的透明区域看到它们。