首先,关于three.js源码翻译-Layers.js可以查看three.js源码翻译-Layers.js
关于Three.js图层(Layers对象和.layers属性)郭隆邦大佬的博客。
其次当时存在两个疑问:
- .toggle方法,是如何进行控制显隐关系,查询资料可得知这个是控制层的显隐是谁填入谁就会被隐藏。
- mask掩码值是否是对应图层。我的理解:mask表示,某一图层执行某一方法后的状态
.layers.set(0)--->mask = 1;.layers.set(1)--->mask = 2;.layers.set(2)--->mask = 8; .layers.enableAll()-->mask=-1; .layers.toggle( 0 )--->mask=-2;//遮蔽0层,显示其他层 .layers.toggle( 1 )--->mask=-3;//遮蔽1层,显示其他层
疑问: .mask属性是用 bit mask 表示当前图层对象与 0 - 31 中的哪些图层相对应。所属层所对应的比特位为 1,其他位位 0.但是在.toggle中所表现出mask的值不与上面所描述的一致。
下面所发出的是我所使用的案例地址,大家可以一起讨论关于mask。
案例地址:
Webgl_layers相关代码理解:
//camera.layers.enableAll();与下面等价
camera.layers.enable( 0 );
camera.layers.enable( 1 );
camera.layers.enable( 2 );
scene = new THREE.Scene();
scene.background = new THREE.Color( 0xf0f0f0 );//控制背景色
//从一个点向各个方向发射的光源。 PointLight( color : Integer, intensity : Float, distance : Number, decay : Float )
const light = new THREE.PointLight( 0xffffff, 1 );
/*全部注销时,默认灯光是0层,0层是红灯,取消时,其他变黑
*light.layers.enable( 0 );-->指开启哪一层的灯,当开灯层都关掉时,剩下的就是黑色了。
*
*/
light.layers.enable( 0 ); // 红
light.layers.enable( 1 ); // 绿
// light.layers.enable( 2 ); // 蓝
scene.add( camera );
camera.add( light );
//层的颜色 0层红色 1层绿色 2层蓝色
const colors = [ 0xff0000, 0x00ff00, 0x0000ff ];