Three.js基礎(chǔ)學(xué)習(xí)之場景對象
前言
本文主要給大家介紹了關(guān)于Three.js場景對象的相關(guān)內(nèi)容,分享出來供大家參考學(xué)習(xí),下面話不多說了,來一起看看詳細(xì)的介紹吧。
通過這一段時(shí)間的學(xué)習(xí),發(fā)現(xiàn)還沒有介紹過場景的基本組件。這一節(jié)就簡單的介紹一下相關(guān)的內(nèi)容:
如果我們想讓物體顯示出來,首先,我們需要有一個(gè)渲染器(new THREE.WebGLRenderer()
)來渲染模型和相機(jī)。
渲染的模型需要放到場景(THREE.Scene()
)對象中,場景對象就是專門放置模型等一系列組件的地方,必須有一個(gè)模型和一個(gè)光源才可以顯示出來模型。
最后需要使用調(diào)用實(shí)例化的渲染器的渲染方法將需要渲染的場景和相機(jī)傳入,才可以顯示出來。
如果需要查看在場景中放置的組件,可以打印一下
console.log(scene.children);
將返回一個(gè)由所有組件組成的組件數(shù)組。
向場景里面添加一個(gè)模型組件的方法將使用
scene.add(THREE.Object3D);
如果需要?jiǎng)h除一個(gè)添加到場景內(nèi)的組件,需要使用
scene.remove(THREE.Object3D);
遍歷scene場景內(nèi)的所有的子元素的方法:
scene.traverse(function(obj){console.log(obj)});
打印出來的將是場景的每個(gè)子元素。
如果組件設(shè)置了添加了id屬性或者name屬性,則我們可以通過以下方法從場景中獲取到目標(biāo)組件
scene.getObjectByName(name); scene.getObjectById(id);
有了上面的這些方法,我們就可以很方便的對場景內(nèi)的模型組件進(jìn)行操作。
總結(jié)
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家學(xué)習(xí)或者使用Three.js具有一定的參考學(xué)習(xí)價(jià)值,如果有疑問大家可以留言交流,謝謝大家對腳本之家的支持。
相關(guān)文章
javascript實(shí)現(xiàn)用戶點(diǎn)擊數(shù)量統(tǒng)計(jì)
本文主要javascript實(shí)現(xiàn)用戶點(diǎn)擊數(shù)量統(tǒng)計(jì)的方法進(jìn)行詳細(xì)介紹,具有很好的參考價(jià)值,需要的朋友一起來看下吧2016-12-12Layui table 組件的使用之初始化加載數(shù)據(jù)、數(shù)據(jù)刷新表格、傳參數(shù)
這篇文章主要介紹了Layui table 組件的使用之初始化加載數(shù)據(jù)、數(shù)據(jù)刷新表格、傳參數(shù)的實(shí)現(xiàn)代碼,需要的朋友可以參考下2017-09-09JavaScript實(shí)現(xiàn)簡易輪播圖最全代碼解析(ES6面向?qū)ο?
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)簡易輪播圖最全代碼,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-09-09詳解BootStrap中Affix控件的使用及保持布局的美觀的方法
Affix是BootStrap中的一個(gè)很有用的控件,他能夠監(jiān)視瀏覽器的滾動(dòng)條的位置并讓你的導(dǎo)航始終都在頁面的可視區(qū)域。本文重點(diǎn)給大家介紹BootStrap中Affix控件的使用及保持布局的美觀的方法,感興趣的朋友一起看看吧2016-07-07微信小程序?qū)崿F(xiàn)組件頂端固定或底端固定效果(不隨滾動(dòng)而滾動(dòng))
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)組件頂端固定或底端固定效果(不隨滾動(dòng)而滾動(dòng)),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-04-04