現代 script 非常強大。特別是在 WebGL 庫和 SVG/Canvas 元素的支援下。使用正確的工具,您可以為 Web 構建幾乎任何東西,包括基於瀏覽器的遊戲和本機應用程式。許多最新的突破性功能都是在 3D 上執行的,在這篇文章中,我列出了目前可用於 Web 開發人員的最佳 3D JS 庫。

  Three.js

  毫無疑問,Three.js 應該位列榜首。從頭開始學習可能有些複雜,但它也是更好的 3D 庫之一。它由一個核心組管理,並在 GitHub 上免費匯出。 ThreeJS 主要用於 canvas 元素,SVG 元素和用於渲染的 WebGL 庫。
 
  學習繩索是一項挑戰,至少需要中級 script 知識。但您可以在 Three.js 檔案中找到完整的設定。如果您真的想在網上做 3D,那麼這個庫就適合您。這不是唯一的選擇,但它可能是初學者開始快速構建東西的最受歡迎的選擇。
 
  Babylon.js

  我喜歡的另一個強大的庫是 Babylon.js 。這個再次依賴於 WebGL 並且僅在 script 中執行。它比其他庫更受歡迎,但與 Three.js 的覆蓋範圍不同。
 
  對於想要建立基於瀏覽器的網頁遊戲的 WooCommerce 網站開發者來說,它仍然被廣泛認為是一個強大的選擇。在主頁上,您可以找到大量的演示預覽和如何開始 3D 遊戲設計的技巧。
 
  還有許多重要的資源連結,如 GitHub repo 和 Babylon JS 教程。所有這些教程都是由巴比倫團隊設計的,所以他們是開始學習這個圖書館的好地方。
 
  Cannon.js

  為了獲得一些與眾不同的東西,請訪問 Cannon.js 。這並不強加通常的 3D 概念,而是作為基於 script 的遊戲的物理引擎。
 
  Cannon.js 應該快速載入,以便您可以在頁面上快速渲染專案。它與大多數現代瀏覽器相容,並附帶強大的 API,可以從中構建您自己的物理創意。
 
  它適用於 Canvas 元素和 WebGL 應用程式。唯一困難的部分是研究圖書館並克服初始學習曲線。看一下 GitHub 演示頁面,瞭解 Cannon.js 在瀏覽器中的樣子以及它為何如此優秀。
 
  CopperLicht

  像 CopperLicht 這樣的名字您可能不知道會發生什麼。但這是一個強大的 3D script 渲染引擎,專為基於 Web 的 JS 遊戲而構建。
 
  同樣,它是 100%開源的,可以免費用於任何專案。建立 CopperLicht 的公司確實有一些優質的軟體和工具,但這些並不是學習 CopperLicht 庫所必需的。事實上,學習所有功能都很困難,因為它支援一系列 3D 功能,如陰影/燈光,特效和 3D 頁面元素互動。
 
  教程頁面是最好的起點,如果您採取這種方式,願意慢慢來。儘管獲得回報非常值得,但仍有一條陡峭的學習曲線可以讓 CopperLicht 得以實現。
 
  Phoria.js

  對於基於 Web 的移動和螢幕上的 3D 效果您可以嘗試 Phoria.js 。 它實際上是一個圖形庫,但 Phoria 植根於 HTML5 canvas 元素中的 3D 表示。
 
  主站點執行了很多演示,是一個相當合理的庫來建立 3D 圖形。學習曲線並不太難,您可以在網站上找到許多可以複製/貼上的程式碼片段。
 
  此外,您甚至不使用 WebGL,因此您不必擔心該庫。雖然您將不得不處理畫布的元素,但這也僅僅意味著練習。
 
  Scene.js

  對於在 WebGL 中執行的內容,請訪問 Scene.js 。目前,在 4.2 版本中,這個巨大的開源庫允許您為任何現代瀏覽器表示 3D 元素。
 
  它得到了大型開發團隊的支援,並且經過多年的重要更新,使其成為您可以使用的最佳 3D 渲染指令碼之一。 但是,這被稱為顯示庫,因此它不僅僅用於渲染基本圖形。相反,這可以用於更復雜的任務,例如從不同角度設計多個物件檢視,甚至建立 3D 遊戲的基本圖形。
 
  D3.js

 
  在瀏覽網頁時,您經常會發現依賴於 3D 效果的圖形和圖形。其中許多都在 D3.js 中執行,這是一個強大的 script 庫來表示 3D 資料。
 
  它也是一個完全免費的開源專案,有一個非常有用的 GitHub 頁面。目標是在 HTML 中使用 SVG 元素和畫布來建立動態資料,這些資料可以動態顯示,旋轉並最終直觀地顯示資訊。
 
  LightGL.js

  我沒有在網上看到很多關於 LightGL.js 的內容,但它是瀏覽器中 3D 渲染的絕佳選擇。
 
  這個免費的開源庫在 WebGL 框架下執行,是您可以使用的最快,最輕的庫。它的工作級別低於大多數抽象庫,因此需要更好地理解 script 。
 
  大多數開發人員只想要簡單,所以在水冷卻器周圍分享它的人數可能會減少。但是,如果您對使用 script 感到滿意,LightGL 將為您提供更多的程式碼庫控制。
 
  Seen.js

  由於完全缺乏依賴關係,我必須在此列表中包含 Seen.js 。同樣,它在 HTML5 canvas 元素上執行,但它可以在沒有任何其他必需庫的 vanilla script 中執行。
 
  它對所有開發人員完全免費,並且可以在 Apache 2.0 許可下自由定製。考慮到它們僅使用 script 構建,一些演示非常瘋狂。
 
  任何願意突破基本 3D 視覺化界限的人都可以看看 Seen.js 。它可能沒有像 Three.js 這樣的大型追隨者,但它是一個很好的畫布/SVG 替代品,不會嚴重依賴 WebGL 。