如何使用HTML5 Canvas製作3D射擊遊戲？

Question

我想使用HTML5 Canvas製作一個3D射擊遊戲（只是拍攝，沒有任何動作或任何東西）。

我該怎麼做？我搜索了一些教程，但我找不到任何好的教程。

Answer 1

你知道WebGL嗎？ http://en.wikipedia.org/wiki/WebGL

Answer 2

你在找什麼Canvas with 3D content，現在已經變成WebGL。

我發現了一個教程：Learning WebGL

Answer 3

這裏是一個不錯的網站有16起動教程

http://learningwebgl.com/blog/?page_id=1217

Answer 4

首先我認爲這個問題是比較適合gamedev stackexchange網站（HTTP的： //gamedev.stackexchange.com/）

正如別人所說，你需要學習WebGL，這是OpenGL ES 2.0用於大多數瀏覽器的ECMAScript實現的API。您需要支持WebGL的瀏覽器（最新版本的Firefox，Chrome或Safari）以及與OpenGL ES 2.0兼容的圖形卡驅動程序。

從遊戲開發imo開始學習的第一件事是關於一些矩陣和向量操作的數學。在網上搜索關於如何進行矩陣乘法，轉置，如何獲得4x4矩陣的行列式（這與獲得3x3或2x2矩陣行列式不同）以及如何反轉矩陣的一些很好且快速的教程應該足夠了。然後學習一些（非常容易的）向量操作，Dot產品，Cross產品，adition，乘法，規範化和縮放。

然後瞭解轉換矩陣，旋轉，平移和比例矩陣。視圖和投影矩陣也是如此。

小的GLSL着色語言的，什麼是3D模型（頂點位置，法線，紋理座標和材料）。

好吧，那些是關鍵字，現在谷歌它的一切。這裏有一系列關於ya矢量操作的教程：http://www.dickbaldwin.com/KjellTutorial/KjellVectorTutorialIndex.htm

Answer 5

您可能想要類似three.js的東西。它主要是一個WebGL框架，但您也可以在（2D）畫布上使用/ fallback。

Here are some of the 3D canvas demos。