想要让模型呈现不同的颜色，我们就需要使用标准材质StandarMaterial。

创建材质

从babylonjs中引入并创建StandarMaterial类，指定name和scene，再将实例赋值给box的material属性，即可快速的创建一个标准材质：

  1. import { 
  2.   ArcRotateCamera,
  3.   Color3,
  4.   Engine,
  5.   MeshBuilder,
  6.   Scene,
  7.   Vector3,
  8.   Color4,
  9.   DirectionalLight,
  10.   StandardMaterial
  11. } from 'babylonjs';
  13. /** 省略部分代码 */
  15. const createScene = (engine: Engine) => {
  16.   /** 创建场景 */
  17.   const scene = new Scene(engine);
  18.   scene.clearColor = Color4.FromColor3(Color3.Gray());
  19.   /** end */
  21.   /** 创建相机 */
  22.   const camera = new ArcRotateCamera('camera', 0, 0, 10, Vector3.Zero(), scene);
  23.   camera.attachControl(true);
  24.   /** end */
  26.   /** 创建立方体 */
  27.   const box = MeshBuilder.CreateBox('box', { width: 2, height: 3, depth: 4 }, scene);
  28.   /** end */
  30.   /** 创建灯光 */
  31.   const light = new DirectionalLight('light', Vector3.Down(), scene);
  32.   light.diffuse = Color3.Red();
  33.   light.specular = Color3.Green();
  34.   /** end */
  36.   /** 创建标准材质 */
  37.   const material = new StandardMaterial('boxMaterial', scene);
  38.   box.material = material;
  39.   /** end */
  41.   return scene;
  42. };

现在，box已经准备好显示不同的颜色了，我们需要更改material的一些属性。

指定颜色

正如上一节灯光所述，在3D世界中，一个模型最终呈现的颜色由多个因素影响，并且，材质对不同的光色设置的属性也不同。在官方文档中，标准材质有以下四个光色属性：

  1. diffuseColor：漫反射色，即在光照条件下材质呈现的颜色
  2. specularColor：高光色，即光源在材质上呈现的颜色（类似在镜子中看灯泡）
  3. emissiveColor：自发光色，即没有任何灯光时材质呈现的颜色，也可以理解为材质的固有颜色
  4. ambientColor：环境光色，即在环境光下材质呈现的颜色（需要先给scene指定ambientColor属性）

下面我们依次演示下这几种颜色究竟有什么不一样。

漫反射色

我们给material.diffuseColor指定一个颜色：