1

前言

玩摄影的同学应该知道,光影是呈现物体的很重要的因素。在前面的两节学习中,我们知道了怎么布置摄影棚(包括场景、照相机和渲染器)和如何塑造模特(包括几何体和材料)。那么这节的主要内容就是学习如何来布置光,让你的模特在不同的光影下呈现出不同的效果。

环境光(AmbientLight)

three.js官方文档--环境光)环境光会同等地照亮环境中的所有物体,并且环境光不能让物体产出投影,因为它没有方向。

构造器

函数:AmbientLight( color, intensity );用来创建一个环境光的实例对象;
参数:

  1. color:设置环境光的颜色;

  2. intensity:设置环境光的强度。

属性

  1. castShadow:这个属性在环境光中是undefined,因为环境光不能让物体产生投影。

  2. isAmbientLight:这个属性用来检测给出的光源是否是环境光。

方法

  1. .copy(source):将source光源的颜色和强度复制到当前光对象中;

  2. toJSON(meta):以JSON的形式返回光的参数。

接下来我们来看看物体打上环境光的效果:

clipboard.png

github项目:环境光

平行光(DirectionalLight)

three.js官方文档——平行光)平行光是从一个特定方向发出的光线互相平行的光。这种类型的光通常用来模拟白天的光,太阳距离我们足够远,因此太阳光可以被看作是平行光。平行光可以产生投影。

备注:通常有一个困惑就是对于平行光来讲设置旋转并没有什么效果,这是因为这里的平行光等同于其他的应用中的“目标平行光”。这意味着它的方向是由光的位置和物体的位置来计算出来的,也是这个原因允许平行光产生投影,

构造器

函数:DirectionalLight( color, intensity )
参数:

  1. color:设置平行光的颜色;

  2. intensity:设置平行光的强度;

属性

  1. .castShadow:如果设置为true,将会产生动态的投影,默认值为false

  2. .isDirectionalLight:默认值为true且不能修改,这个属性用来检测光是否为平行光;

  3. .position:相当于设置 Object3D.DefaultUp 坐标坐标为( 0, 1, 0 ),相当于光线是从正上方平行照射下来;

  4. .shadow:用来为光线计算阴影;

  5. .target:平行光的方向是从光的位置指向目标物体的位置,默认目标物体的位置是( 0, 0, 0 )。
    备注:如果目标物体的位置移动到除了默认位置的其它位置,那么必须重新被添加到场景中通过scene.add(light.target);当然也可以将目标物体换为场景中的其它物体,如下所示:

var targetObject = new THREE.Object3D();
    scene.add(targetObject);

    light.target = targetObject;

方法

  1. .copy(source):将source光源的颜色和强度复制到当前光对象中;

  2. toJSON(meta):以JSON的形式返回光的参数。

接下来我们看看给物体打上平行光的效果:

clipboard.png

github项目:平行光

点光(PointLight)

顾名思义,点光是由一个点光源向四面八方发出光线。通常使用到这种光的情况是模拟从一个单独的灯泡上发出光线的情况。

构造器

函数:PointLight( color, intensity, distance, decay )
参数:

  1. color:设置光的颜色;

  2. intensity:设置光的强度,默认值为1;

  3. distance:设置光距离物体的距离;

  4. decay:设置光的衰减量;

属性

  1. .decay:默认值为1;

  2. .distance:默认为0.0,这个属性描述了光线强度减弱到0时距离光源的位置;

  3. .isPointLight:默认值为true,用来检查光线是否为点光;

  4. .power:用来描述光的能量,默认为4pi;

  5. .shadow:用来计算光所产生的阴影

方法

  1. .copy(source):将source光源的颜色和强度复制到当前光对象中;

  2. toJSON(meta):以JSON的形式返回光的参数。

接下来我们看给物体打上点光的效果,可以明显地看到点光的光圈。

clipboard.png

github项目:点光

矩形区域光(RectAreaLight)

three.js官方文档——矩形区域光)这种光从一个矩形面均匀地发射,可以用来模拟明亮的窗户或者带状的照明。这类型的光可以产生投影。

构造器

函数:RectAreaLight( color, intensity, distance, angle, penumbra, decay )
参数:

  1. color:设置光的颜色;

  2. intensity:设置光的强度,默认值为1;

  3. distance:设置光距离物体的距离;

  4. angle:设置光的照射角度;

  5. penumbra:这个参数不是很清楚。。。;

  6. decay:设置光的衰减量;

属性

  1. .castShadow:如果设置为true,将会产生动态的投影,默认值为false

  2. .decay:描述光的衰减,默认值为1;

  3. .distance:默认为0.0,这个属性描述了光线强度减弱到0时距离光源的位置;

  4. .isRectAreaLight:默认为true,用来检查光是否是矩形区域光;

  5. .position:相当于设置 Object3D.DefaultUp 坐标坐标为( 0, 1, 0 ),相当于光线是从正上方平行照射下来;

  6. .shadow:用来计算光所产生的阴影;

  7. .target:平行光的方向是从光的位置指向目标物体的位置,默认目标物体的位置是( 0, 0, 0 )。

方法

  1. .copy(source):将source光源的颜色和强度复制到当前光对象中;

  2. toJSON(meta):以JSON的形式返回光的参数。

聚光灯(SpotLight)

聚光灯是由点光源发出,这种类型的光也可以产生投影。

构造器

函数:SpotLight( color, intensity, distance, angle, penumbra, decay )
参数:

  1. color:设置光的颜色;

  2. intensity:设置光的强度;

  3. distance:设置光源到物体的距离;

  4. angle:聚光灯能够照射的最大范围;

  5. penumbra:由于边缘造成的聚光锥衰减的百分比;

  6. decay:光的衰减速度;

属性

  1. .angle:默认值为Math.PI/3,不超过Math.PI/2;

  2. .castShadow:默认值为true,值为true时会动态投影;

  3. .decay:设置光的衰减程度,值在0和1之间;

  4. .distance:设置光衰减为0时距离光源的距离;

  5. .isSpotLight:用来检查光源是否是聚光灯;

  6. .penumbra:由于光边缘造成的聚光锥衰减的百分比,值可以在0和1之间,默认值为0;

  7. .position:相当于设置 Object3D.DefaultUp 坐标坐标为( 0, 1, 0 ),相当于光线是从正上方平行照射下来;

  8. .power:光强度大小,默认值为4PI;

  9. .shadow:SpotLightShadow用来计算光产生的阴影;

  10. .target:平行光的方向是从光的位置指向目标物体的位置,默认目标物体的位置是( 0, 0, 0 )。

方法

  1. .copy(source):将source光源的颜色和强度复制到当前光对象中;

  2. toJSON(meta):以JSON的形式返回光的参数。


sushi
135 声望19 粉丝

小目标总是要有的,万一实现了呢^^


引用和评论

0 条评论