溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

three.js中三維模型加載量測(cè)試的示例分析

發(fā)布時(shí)間：2021-12-03 14:35:16 來(lái)源：億速云 閱讀：169 作者：小新 欄目：大數(shù)據(jù)

這篇文章給大家分享的是有關(guān)three.js中三維模型加載量測(cè)試的示例分析的內(nèi)容。小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過(guò)來(lái)看看吧。

three.js能夠加載處理過(guò)的三維模型數(shù)據(jù)，隨著Cesium中可加載gltf的模型，three.js也能夠進(jìn)行支持，  GIS開(kāi)發(fā)：Threejs加載gltf模型，加載比較小的幾個(gè)是沒(méi)問(wèn)題的，這里批量加載了一些量比較大的模型進(jìn)行測(cè)試。  
gltf是用blender進(jìn)行導(dǎo)出的，直接導(dǎo)出的壓縮格式，后綴名是.glb的。  

  • 模型數(shù)量有500多個(gè)

  • 導(dǎo)出的.glb數(shù)據(jù)數(shù)據(jù)量總共1GB左右

  • 使用nginx進(jìn)行模型數(shù)據(jù)發(fā)布

  • 循環(huán)使用THREE.GLTFLoader進(jìn)行模型加載

  • 模型全部加載

模型加載完成的效果：  

three.js中三維模型加載量測(cè)試的示例分析

模型的測(cè)試效果：  

  • 本機(jī)測(cè)試，數(shù)據(jù)傳輸速度還是比較快的，不到1分鐘加載完成

  • 加載的時(shí)候，場(chǎng)景移動(dòng)有些卡頓，模型加載完成后，場(chǎng)景操作就比較流暢了

  • 性能消耗比較大，chrome的內(nèi)存已經(jīng)占用到4GB多了

  • 模型細(xì)節(jié)還原的真實(shí)度還是可以的

綜述：  

  • 使用three.js，很容易添加場(chǎng)景的一些光照和陰影等效果；

  • 制作一個(gè)小的三維場(chǎng)景還是可以的；

  • 每個(gè)模型上的效果，還是有API進(jìn)行控制的；

  • 電腦性能還是要求比較高的，瀏覽器方面，還是chrome展現(xiàn)的最好；

  • 重復(fù)的對(duì)象，比如樹(shù)木、路燈等小部件，加載一次模型，復(fù)制對(duì)象，設(shè)置位置，這樣效率會(huì)高很多；

  • 優(yōu)化方面，要想提高模型的加載量，可以根據(jù)視野動(dòng)態(tài)加載、卸載模型數(shù)據(jù)，這要在基礎(chǔ)上進(jìn)一步開(kāi)發(fā)；

  • 模型細(xì)節(jié)、貼圖優(yōu)化也是一方面，但是這樣會(huì)降低模型的展示效果；

  • 功能方面，特別是gis方面，還是需要自己開(kāi)發(fā)的。

感謝各位的閱讀！關(guān)于“three.js中三維模型加載量測(cè)試的示例分析”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)，如果覺(jué)得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手