Reputation: 15959

How can I make a 3D shooting game using HTML5 Canvas?

I want to make a 3D shooter (just shooting, no movements or anything) using HTML5 Canvas.

How can I do that? I searched for some tutorials but I couldn't find any good ones.

Upvotes: 3

Answers (5)

Liam

Reputation: 2167

You probably want something like three.js. It's primarily a WebGL framework, but you can also use/fallback on (2D) canvas.

Here are some of the 3D canvas demos.

Upvotes: 1

Delta

Reputation: 4328

First of all I think this question is more suitable for the gamedev stackexchange website (http://gamedev.stackexchange.com/)

As said by the others, you gonna need to learn WebGL, which is the OpenGL ES 2.0 API for the ECMAScript implementation of most browsers. You need a WebGL enabled browser (The latest version of Firefox, Chrome or Safari) and a graphics card driver compatible with OpenGL ES 2.0.

The first thing to learn when beginning with game development imo are the maths about some matrix and vector operations. Search the web for some nice and fast tutorials on how to do matrix multiplication, transposition, how to get the determinant of a 4x4 matrix (which is different from getting a 3x3 or 2x2 matrix determinant) and how to invert a matrix should be enough. Then learn some (pretty easy) vector operations, Dot product, Cross product, adition, multiplication, normalization and scaling.

Then learn about the transformation matrices, the rotation, translation and scale matrices. And the view and projection matrices as well.

A little of the GLSL shading language and what are 3D models (Vertex positions, normals, texture coordinates and materials).

Ok, those are the keywords, now google it all. Here is a nice series of tutorials about vector operations for ya: http://www.dickbaldwin.com/KjellTutorial/KjellVectorTutorialIndex.htm

Upvotes: 4