3D-ThingJS,three.js,unity 3D


一、架構圖

 

 

二、Three.js、ThingJS、Unity3D

Three.js

ThingJS

 

 

 

 

 

 

 

 

 

 

 

 調研reactNative加載3D效果

一、理論介紹

OpenGL 是用於計算機圖形繪制的編程接口標准,支持不同平台上的圖形繪制。

OpenGL ES 針對於嵌入式設備(是一種嵌入機械或電氣系統內部、具有專一功能和實時計算性能的計算機系統:如手機游戲機等)圖形開發的標准OpenGL ES。

WebGL 是一項用來 在網頁上繪制和渲染復雜三維圖形(3D圖形),並允許用戶與之交互的技術。 隨着個人計算機和瀏覽器的性能越來越強,我們能夠在Web上創建越來越精美、越來越復雜的3D圖形。

 OpenGL ES 可以說是 OpenGL 為了滿足嵌入式設備需求而開發一個特殊版本,是其一個子集;而 WebGL,是為了網頁渲染效果,將 JavaScript 和 OpenGL ES 2.0 結合在一起,通過增加 OpenGL ES 2.0 的一個JavaScript綁定得到

Three.js 是一款運行在瀏覽器中的 3D 引擎,它是對webGL的封裝,你可以用它創建各種三維場景,包括了攝影機、光影、材質等各種對象。

react-three-fiber是Three.js進一步封裝用於react.js前端架構。

 

 

二、RN加載3D模型

方案一:

在rn中直接編寫代碼加載3D模型

實現方案

1、通過expo-three組件庫去加載3D模型

2、通過react-three-fiber組件庫去加載3D模型

結果:都不能很好的支持

1、最新的版本快速開始都不能運行

2、版本回退可以顯示,但有一些事件不能很好的支持

https://github.com/expo/expo-three/issues/257

https://github.com/pmndrs/react-three-fiber/issues/2171

 

方案二: 
rn通過webview去加載3D。 可行✅

 

 

參考:

https://zhuanlan.zhihu.com/p/216100434

https://www.cnblogs.com/thingjs/p/13925390.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM