哪個更適合3D創業專案？一篇文章講全ThingJS、Three.js和Unity 3D之異同

Unity官方支援C#專案，但是很多人表明，順便也把JS給學了，JS作為輕便的前端語言，ThingJS開發平臺更適合專案創業！

基於WebGL周邊衍生了眾多的第三方庫，其中Three.js屬於開發應用，做了一定的渲染細節封裝，ThingJS則封裝更多對模型的操作，力求讓更多無3D開發經驗的人員上手。以Unity 3D為代表的OpenGL出現更早，開發者可以在Unity 3D平臺上構建各種AR和VR互動體驗，同時可以釋出WebGL版本。下面基於開發體驗、場景資源和使用者技能等三大維度比較這三款3D框架。

 

Three.js

目前最流行的開源3D框架，2009年4月誕生，2005年adobe收購了macromedia的flash產品，2008，2009年正是flash如日中天之時,threejs也識時務的選擇了flash的ActionScript平臺，後來flash沒落之後選擇了WebGL。

 

ThingJS

新興的3D框架，2018年誕生，是針對物聯網領域的JavaScript 3D Library。它是由在3D領域經營多年的優鍩科技公司研發，旨在簡化3D應用開發。

 

Unity3D

Unity 是遊戲引擎開發商，為遊戲開發、美術、建築、汽車設計、影視製作在內的創作者提供一整套軟體解決方案，可用於創作、運營和變現實時互動的2D/3D內容。 2020年5月9日，Unity宣佈收購加拿大技術服務公司Finger Food，擴充工業應用版圖，在建築設計、工程、施工等領域擴充套件。

 

以下是Three.js、ThingJS、Unity3D三個專案的基礎情況。

 

1、 開發體驗對比

Three.js 是大多數開發者首次接觸的WebGL 3D庫，Threejs庫的出現解決了底層的渲染細節和複雜的資料結構，終於將複雜的底層細節抽象出來。但對於初學者來說需要花費很多時間，就一個載入模型、調光、選擇模型彈框的功能，就能寫出Threejs上百行程式碼。

 

ThingJS 是更為上層的抽象，不用關心渲染、mesh、光線等複雜概念。ThingJS封裝了對模型互動事件的API、對模型的操作及層次關係，一個個具體的模型抽象把初學者從複雜的3D概念中解放出來。

 

Unity 3D 需要下載和安裝Unity編輯器以便建立3D專案，不同於Web前端開發JS語言，C#語言物件導向的特性完整，有利於程式設計。只是相對來說，C#語言學習成本更高。Unity 3D釋出操作流程不夠簡潔，跨平臺釋出需要數小時不等。

 

2、 場景資源對比

ThingJS 考慮3D專案開發的便捷性，提供無需3D建模知識即可上手的場景搭建工具和無維護成本的場景儲存雲空間，模型庫提供上萬個行業模型資源。

 

Three.js 和Unity 3D沒有提供場景解決方案和模型庫，需要團隊手動維護，對於模型匯出和載入有很高的要求。

 

3、 使用者技能要求對比

ThingJS 線上開發具備JS基礎即可，不需要3D開發技能，入門時間僅數小時。

ThreeJS 則需要學習很多複雜的3D概念，初學者上手需要花數週或更長時間，尤其需要專業美術人員完成建模和匯出工作，團隊協作成本高。

Unity 3D 開發者需要有C#語言基礎，具備3D開發專業知識，需要至少一週時間入門開發。

 

ThingJS 主要優勢在於入門簡單、釋出迅速，功能和設計更接近行業應用的需求，面向非專業3D使用者提供的工具與資源，更適合物聯網視覺化應用。

 

Three.js 底層引擎級別的三維圖形庫，有很多開源庫對它進行擴充套件，但較為鬆散，適合做輕量級視覺化應用，複雜應用則需要基於此庫進行大量封裝才行。

 

Unity 3D 優勢在於遊戲開發，有很好的生態，效能效果都有很好表現，但輸出結果較封閉，適合做終端使用者的產品，不適合基於此做web上的二次開發。

 

為了體驗3D便捷開發，我們再來看下ThingJS的模型載入示例。

var app = new THING.App({
container: 'div3d',
url: 'https://speech.uinnova.com/static/models/building'
});

只關注場景在頁面的div的id和場景存放的地址，所有的細節ThingJS都處理好了。場景載入完之後便可從場景獲得載入內容，並進行互動應用開發。夠簡單！

// 獲取建築物件
var building = app.buildings[0];
// 列印建築中所有的樓層
building.floors.forEach(function(floor) {
    console.log('Floor: ' + floor.id);
});
// 獲取室外物件
var outdoors = app.outdoors;
// 列印室外所有物體
outdoors.things.forEach(function(thing) {
    console.log('Thing: ' + thing.id);
});

ThingJS為物聯網開發團隊助力，快速落地專案！

來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/69980539/viewspace-2717286/，如需轉載，請註明出處，否則將追究法律責任。