Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I have recently been working on a 3D engine from scratch, using JavaScript and HTML5. I've successfully created lines (although slightly buggy) and points, but I can't figure out faces. My current code:

How do I add filled faces to form the surface of my figure? I don't even know where to start.

share|improve this question
What's the question? – Byte56 Dec 17 '12 at 16:56
"How do I make a face in 3d?" essentially. – Dylan Katz Dec 17 '12 at 20:48
It's typically a good idea to include the question in your question. No need to link to your code. And tell us what you've tried already and what about it didn't work. – Byte56 Dec 17 '12 at 20:52
Sorry, thanks for the help. – Dylan Katz Dec 17 '12 at 22:34
up vote 3 down vote accepted

If you want to render 3D I suggest that you take a look at WebGL.

Non-WebGL answer:

If you really want to go without you start by fixing your current bugs before moving on to faces. If you can place a point correctly it shouldn't be hard to make uni-coloured faces. You simply make a path between 3 points, and fill it.

Tip: You only need to do translation from 3D to screen coordinates in a single piece of code which you can reuse for points, lines and faces.

Problems a bit further down the road:

Polygons that are partly in view, especially those that have a point behind or at the view plane can be tricky to deal with, but it's still reasonably possible if you know what you are doing.

Z-order, that is figuring which surfaces should be on the top, is hell, maybe you can for your specific scenes figure a way to do it reasonably.

Texture is also going to be pretty hard to do well.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.