JavaScript中3D渲染的最佳在線資源是什麼？

Question

首先一點介紹：

去年我寫了這個http://dragan.yourtree.org/code/canvas-3d-graph/

現在，我想讓它完全重寫，因爲舊版本有一定的侷限性，例如：有時會發生這條不可見的，因爲它們被一個接一個地拉開。

在舊版本沒有真正的3D，只是bunck 2D線，模擬3D。

現在，我想要去全面的3D場景，我想保留在內存中的所有對象，並添加一些3D導航按鈕，將使用戶在所有3軸上旋轉整個場景，並且放大和縮小相機。

我已經決定，我將使用http://sylvester.jcoglan.com/矢量/矩陣的東西，但我仍然無法找到很好的教程爲3D。互聯網上有很多文字，其中大部分都是90年代的文字，不完整或寫得很糟糕。

所以，我的問題是：什麼是最好的網上資源/教程將讓我從頭開始寫我自己的JS 3D引擎。

應該涵蓋所有相關主題：

• 載體
• 矩陣
• 對象
• 相機
• 場景渲染場景
• 照明
• 旋轉物體
• 移動相機

等。 （我相當熟悉的前兩個）

謝謝您的時間。

Answer 1

如果這是專門爲JavaScript相關的項目，那麼我明白，但如果你只是這樣做來掌握3d渲染的基礎知識，那麼可能會有更多成熟的平臺供你使用。

在任何情況下..

鏈接，可能是有用的，你的學習：

• Prototyping A Simple 3d Renderer In JavaScript
• 3D Basics - A Primer
• The JavaScript Raytracer
• JavaScript 3D Renderer

此外，一些有趣的JavaScript 3D例子：

• Rotating 3D Cube in JavaScript
• Wolfenstein 3D in JavaScript
• 別的在這個SO問題：Stunning graphic effects with JavaScript?

Answer 2

只是一對夫婦的建議，但可能不是你尋找什麼：

我建議你看看雅各Seidelin的畫布的例子在nihilogic.dk：http://blog.nihilogic.dk/search/label/canvas。

如果您願意放棄畫布並使用現有的閃存庫，請查看Sandy3D：http://www.flashsandy.org/demos。

Answer 3

透視投影： http://www.cse.unr.edu/~bebis/CS791E/Notes/PerspectiveProjection.pdf

Answer 4

http://www.gamedev.net/

它已經相當因爲我最後一次嘗試做圖形/遊戲/ 3D任何一段時間，但我記得這個網站作爲最廣泛的一個已知的資源。

http://www.gamedev.net/reference/

當然，這是非常通用，並覆蓋更多的東西比你要求的，但它包含了數學和物理的東西好東西。

Answer 5

可悲的事實是，還有沒有真正的支持JavaScript中的3D圖形。
因此，您所做的任何事情都必須涉及完全實現3D渲染器（或者使用其他人已經實現的）
由於這些東西通常是用硬件實現的，而且您正在編寫JavaScript，所以對於其他任何東西比瑣碎的場景。

對於3D圖形，Java，C＃或C++等語言會更好地爲您服務。

Answer 6

有一種可用於Firefox的技術"Canvas 3D"。 還有一個名爲C3DL的實用程序，它可以更容易地使用此技術。

不幸的是，據我所知，沒有歌劇院/ Internet Explorer中/ WebKit的等效 - 這個插件僅適用於火狐3（Firefox 2中和Firefox 3.1測試版不支持）...