Three.js基础学习之场景对象


Posted in Javascript onSeptember 27, 2017

前言

本文主要给大家介绍了关于Three.js场景对象的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。

通过这一段时间的学习,发现还没有介绍过场景的基本组件。这一节就简单的介绍一下相关的内容:

如果我们想让物体显示出来,首先,我们需要有一个渲染器(new THREE.WebGLRenderer() )来渲染模型和相机。

渲染的模型需要放到场景(THREE.Scene() )对象中,场景对象就是专门放置模型等一系列组件的地方,必须有一个模型和一个光源才可以显示出来模型。

最后需要使用调用实例化的渲染器的渲染方法将需要渲染的场景和相机传入,才可以显示出来。

如果需要查看在场景中放置的组件,可以打印一下

console.log(scene.children);

将返回一个由所有组件组成的组件数组。

向场景里面添加一个模型组件的方法将使用

scene.add(THREE.Object3D);

如果需要删除一个添加到场景内的组件,需要使用

scene.remove(THREE.Object3D);

遍历scene场景内的所有的子元素的方法:

scene.traverse(function(obj){console.log(obj)});

打印出来的将是场景的每个子元素。

如果组件设置了添加了id属性或者name属性,则我们可以通过以下方法从场景中获取到目标组件

scene.getObjectByName(name); 
scene.getObjectById(id);

有了上面的这些方法,我们就可以很方便的对场景内的模型组件进行操作。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家学习或者使用Three.js具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
javascript 进度条 实现代码
Jul 30 Javascript
JS正则中的RegExp对象对象
Nov 07 Javascript
js中创建对象的几种方式示例介绍
Jan 26 Javascript
基于canvas实现的钟摆效果完整实例
Jan 26 Javascript
JavaScript的设计模式经典之建造者模式
Feb 24 Javascript
JS取模、取商及取整运算方法示例
Oct 13 Javascript
解决在vue+webpack开发中出现两个或多个菜单公用一个组件问题
Nov 28 Javascript
js+css实现打字效果
Jun 24 Javascript
基于JavaScript canvas绘制贝塞尔曲线
Dec 25 Javascript
uploadify插件实现多个图片上传并预览
Sep 30 Javascript
微信小程序学习总结(二)样式、属性、模板操作分析
Jun 04 Javascript
微信小程序APP的事件绑定以及传递参数时的冒泡和捕获
Apr 19 Javascript
vue父组件中获取子组件中的数据(实例讲解)
Sep 27 #Javascript
Web开发使用Angular实现用户密码强度判别的方法
Sep 27 #Javascript
基于复选框demo(分享)
Sep 27 #Javascript
EasyUI框架 使用Ajax提交注册信息的实现代码
Sep 27 #Javascript
angular内置provider之$compileProvider详解
Sep 27 #Javascript
详解Node.js利用node-git-server快速搭建git服务器
Sep 27 #Javascript
微信小程序 循环及嵌套循环的使用总结
Sep 26 #Javascript
You might like
模拟OICQ的实现思路和核心程序(三)
2006/10/09 PHP
lyhucSelect基于Jquery的Select数据联动插件
2011/03/29 Javascript
Javascript处理DOM元素事件实现代码
2012/05/23 Javascript
浏览器加载、渲染和解析过程黑箱简析
2012/11/29 Javascript
jQuery知识点整理
2015/01/30 Javascript
jQuery包裹节点用法完整示例
2016/09/13 Javascript
JQuery手速测试小游戏实现思路详解
2016/09/20 Javascript
js 事件的传播机制(实例讲解)
2017/07/20 Javascript
详解Vue的computed(计算属性)使用实例之TodoList
2017/08/07 Javascript
微信小程序之发送短信倒计时功能
2017/08/30 Javascript
浅谈angularJS2中的界面跳转方法
2018/08/31 Javascript
在vue中使用echarts图表实例代码详解
2018/10/22 Javascript
ng-zorro-antd 入门初体验
2018/12/03 Javascript
js/jquery遍历对象和数组的方法分析【forEach,map与each方法】
2019/02/27 jQuery
nodejs使用async模块同步执行的方法
2019/03/02 NodeJs
jquery实现下载图片功能
2019/07/18 jQuery
JS实现简单移动端鼠标拖拽
2020/07/23 Javascript
修改Vue打包后的默认文件名操作
2020/08/12 Javascript
Python写的PHPMyAdmin暴力破解工具代码
2014/08/06 Python
Python实例一个类背后发生了什么
2016/02/09 Python
使用Python爬虫库requests发送请求、传递URL参数、定制headers
2020/01/25 Python
Python json模块与jsonpath模块区别详解
2020/03/05 Python
python如何从键盘获取输入实例
2020/06/18 Python
python 贪心算法的实现
2020/09/18 Python
python3实现飞机大战
2020/11/29 Python
英国领先的豪华时尚家居网上商店:Amara
2019/08/12 全球购物
日本最大的购物网站乐天市场国际版:Rakuten Global Market(支持中文)
2020/02/03 全球购物
内容编辑个人求职信
2013/12/10 职场文书
优秀教师自我评价范文
2014/09/27 职场文书
分居协议书范本(律师见证版)
2014/11/26 职场文书
2015年业务员工作总结范文
2015/04/07 职场文书
心灵点滴观后感
2015/06/02 职场文书
导游词之苏州盘门景区
2019/11/12 职场文书
教你做个可爱的css滑动导航条
2021/06/15 HTML / CSS
Golang 1.18 多模块Multi-Module工作区模式的新特性
2022/04/11 Golang
mysql 乱码 字符集latin1转UTF8
2022/04/19 MySQL