举荐:将NSDT场景编辑器退出你的3D工具链
其余系列工具:NSDT简石数字孪生
材质共有属性、公有属性
如果你的javascript语言根底还能够,应该明确类、基类、子类、父类等概念。如果你有这些类的概念,那么在学习Threejs的过程中,如何查找Threejs文档将会比较顺利。
点材质PointsMaterial、根底线材质LineBasicMaterial、根底网格材质MeshBasicMaterial、高光网格材质MeshPhongMaterial等材质都是父类Material的子类。
各种各样的材质子类都有本人的特定属性,比方点材质特有的尺寸属性.size、高光网格材质特有的高光色彩属性.specular等等这些属性能够成为子类材质的公有属性。
所有子类的材质都会从父类材质Material继承透明度opacity、面side等属性,这些来自父类的属性都是子类共有的属性。
.side属性
在Three.js开发过程中你可能会遇到上面的问题,比方three.js矩形立体planegeometry的网格模型插入场景看不到,一个球体或立方体网格模型如何反面显示贴图,侧面不显示...,对于这些问题能够通过Three.js材质对象.side属性来设置。
材质.side属性的具体介绍能够查看Threejs文档中所有材质对象的基类Material。
.side属性的属性值定义面的渲染形式后面前面 或 双面. 属性的默认值是THREE.FrontSide,示意后面. 也能够设置为前面THREE.BackSide 或 双面THREE.DoubleSide.
var material = new THREE.MeshBasicMaterial({ color: 0xdd00ff, // 后面FrontSide 反面:BackSide 双面:DoubleSide side:THREE.DoubleSide,});
材质透明度.opacity
通过材质的透明度属性.opacity能够设置材质的通明水平,.opacity属性值的范畴是0.0~1.0,0.0值示意齐全通明, 1.0示意齐全不通明,.opacity默认值1.0。
当设置.opacity属性值的时候,须要设置材质属性transparent值为true,如果材质的transparent属性没设置为true, 材质会放弃齐全不通明状态。
在结构函数参数中设置transparent和.opacity的属性值
var material = new THREE.MeshPhongMaterial({ color: 0x220000, // transparent设置为true,开启通明,否则opacity不起作用 transparent: true, // 设置材质透明度 opacity: 0.4,});
通过拜访材质对象属性模式设置transparent和.opacity的属性值
// transparent设置为true,开启通明,否则opacity不起作用material.transparent = true; // 设置材质透明度material.opacity = 0.4;
3D建模学习工作室