ThreeJS的层次结构模型

更新时间:2023-06-30 15:31:52 阅读: 评论:0

ThreeJS的层次结构模型
1  基本元素模型
2  层次结构模型
场景对象对象scene构成的层级模型本⾝是⼀个树结构,场景对象层级模型的第⼀层,也就是树结构的根节点,⼀般来说⽹格模型Mesh、点模型Points、线模型Line是树结构的最外层叶⼦结点。构建层级模型的中间层⼀般都是通过Threejs的Group类来完成,Group类实例化的对象可以称为组对象。
答的反义词Threejs渲染的时候从根节点场景对象开始解析渲染,如果⼀个模型要想被渲染出来就要直接或间接插⼊到场景scene中,⼀个光源如果要在光照计算中起作⽤同样需要通过add⽅法插⼊到场景中。
.add()⽅法肛门外痔图片
场景对象Scene、组对象Group、⽹格模型对象Mesh、光源对象Light的.add()⽅法都是继承⾃它们共同的基类。
⽗对象执⾏.add()⽅法的本质就是把参数中的⼦对象添加到⾃⾝的⼦对象属性.children中。
.add()⽅法可以单独插⼊⼀个对象,也可以同时插⼊多个⼦对象。
中国文化遗产有哪些
group.add(mesh1);
group.add(mesh2);
group.add(mesh1,mesh2);
Scene根节点 渲染的问题
.remove()⽅法
.add()⽅法是给⽗对象添加⼀个⼦对象,.remove()⽅法是删除⽗对象中的⼀个⼦对象。 ⼀个对象的全部⼦对象可以通过该对象
的.children()属性访问获得,执⾏该对象的删除⽅法.remove()和添加⽅法.add()⼀样改变的都是⽗对象的.children()属性。
场景Scene或组对象Group的.remove()⽅法使⽤规则可以查看它们的基类。
// 删除⽗对象group的⼦对象⽹格模型mesh1
group.add(mesh1)
// ⼀次删除场景中多个对象
模型命名(.name属性)
在层级模型中可以给⼀些模型对象通过.name属性命名进⾏标记。
group.add(Mesh)
// ⽹格模型命名
Mesh.name = "眼睛"
// mesh⽗对象对象命名
group.name = "头"
树结构层级模型
实际开发的时候,可能会加载外部的模型,然后从模型对象通过节点的名称.name查找某个⼦对象,为了⼤家更容易理解,本节课不加载外部模型,直接通过代码创建⼀个⾮常简易的机器⼈模型,然后在机器⼈基础上进⾏相关操作。
// 头部⽹格模型和组
var headMesh = sphereMesh(10, 0, 0, 0);
headMesh.name = "脑壳"奖学金申请表
var leftEyeMesh = sphereMesh(1, 8, 5, 4);
leftEyeMesh.name = "左眼"
var rightEyeMesh = sphereMesh(1, 8, 5, -4);
rightEyeMesh.name = "右眼"
var headGroup = new THREE.Group();
诉求headGroup.name = "头部"
headGroup.add(headMesh, leftEyeMesh, rightEyeMesh);
// ⾝体⽹格模型和组
var neckMesh = cylinderMesh(3, 10, 0, -15, 0);
neckMesh.name = "脖⼦"
var bodyMesh = cylinderMesh(14, 30, 0, -35, 0);
bodyMesh.name = "腹部"
var leftLegMesh = cylinderMesh(4, 60, 0, -80, -7);
leftLegMesh.name = "左腿"
var rightLegMesh = cylinderMesh(4, 60, 0, -80, 7);
rightLegMesh.name = "右腿"
土豆炖鸡汤var legGroup = new THREE.Group();
legGroup.name = "腿"
legGroup.add(leftLegMesh, rightLegMesh);
var bodyGroup = new THREE.Group();
bodyGroup.name = "⾝体"
bodyGroup.add(neckMesh, bodyMesh, legGroup);
// ⼈Group
var personGroup = new THREE.Group();
personGroup.name = "⼈"
personGroup.add(headGroup, bodyGroup)
scene.add(personGroup);
// 球体⽹格模型创建函数
function sphereMesh(R, x, y, z) {
var geometry = new THREE.SphereGeometry(R, 25, 25); //球体⼏何体
var material = new THREE.MeshPhongMaterial({
国债利息
color: 0x0000ff
}); //材质对象Material
var mesh = new THREE.Mesh(geometry, material); // 创建⽹格模型对象
mesh.position.t(x, y, z);
return mesh;
入学教育心得
}
// 圆柱体⽹格模型创建函数
function cylinderMesh(R, h, x, y, z) {
var geometry = new THREE.CylinderGeometry(R, R, h, 25, 25); //球体⼏何体
var material = new THREE.MeshPhongMaterial({
color: 0x0000ff
}); //材质对象Material
var mesh = new THREE.Mesh(geometry, material); // 创建⽹格模型对象
mesh.position.t(x, y, z);
return mesh;
}
递归遍历⽅法.traver()
Threejs层级模型就是⼀个树结构,可以通过递归遍历的算法去遍历Threejs⼀个模型对象的所有后代,可以通过下⾯代码递归遍历上⾯创建⼀个机器⼈模型或者⼀个外部加载的三维模型。
if (pe === "Group") {
console.log(obj.name);
}
if (pe === "Mesh") {
console.log('  ' + obj.name);
lor.t(0xffff00);
}
if (obj.name === "左眼" | obj.name === "右眼") {
lor.t(0x000000)
}
// 打印id属性
console.log(obj.id);
// 打印该对象的⽗对象
console.log(obj.parent);
// 打印该对象的⼦对象
console.log(obj.children);
})
查找某个具体的模型
看到Threejs的.getObjectById()、.getObjectByName()等⽅法,如果已有前端基础,很容易联想到DOM的⼀些⽅法。
Threejs和前端DOM⼀样,可以通过⼀个⽅法查找树结构⽗元素的某个后代对象,对于普通前端⽽⾔可以通过name或id等⽅式查找⼀个或多个DOM元素,Threejs同样可以通过⼀些⽅法查找⼀个模型树中的某个节点。更多的查找⽅法和⽅法的使⽤细节可以查看基类
// 遍历查找scene中复合条件的⼦对象,并返回id对应的对象
var idNode = ObjectById ( 4 );
console.log(idNode);
// 遍历查找对象的⼦对象,返回name对应的对象(name是可以重名的,返回第⼀个)
var nameNode = ObjectByName ( "左腿" );
lor.t(0xff0000);

本文发布于:2023-06-30 15:31:52,感谢您对本站的认可!

本文链接:https://www.wtabcd.cn/fanwen/fan/89/1061745.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

标签:对象   模型   场景   创建   层级   遍历   节点
相关文章
留言与评论(共有 0 条评论)
   
验证码:
推荐文章
排行榜
Copyright ©2019-2022 Comsenz Inc.Powered by © 专利检索| 网站地图