Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

EDIT This is the WebGL code for initializing the tetrahedron points. You may want to skip to the second code block, because you may be able to answer without this.

    //Making a tetrahedron with equal sides
    //Using rotation matrices to determine the points

    //-120 degrees
    var q = -Math.PI/2.0 * 4.0/3.0;
    //Transformation matrix for X-axis rotation
    var rotationArrayX = [
        1.0,    0.0,            0.0,            0.0,
        0.0,    Math.cos(q),    Math.sin(q),    0.0,
        0.0,    -Math.sin(q),   Math.cos(q),    0.0,
        0.0,    0.0,            0.0,            1.0
    ];

    var rotationMatrixX = mat4.create(rotationArrayX);
    var d = vec3.create(new Array(0.0, 1.0, 0.0)); //Topmost point
    var a = vec3.create();
    mat4.multiplyVec3(rotationMatrixX, d, a);

    //Now we have the top most point and the first point of the base
    //After rotating the vector A with 120 degrees two times, we have the 3 base points

    //120 degrees
    q = -q;
    //Transformation matrix for Y-axis rotation
    var rotationArrayY = [
        Math.cos(q), 0.0, -Math.sin(q),     0.0,
        0.0,         1.0,       0.0,        0.0,
        Math.sin(q), 0.0, Math.cos(q),      0.0,
        0.0,         0.0,       0.0,        1.0
    ];

    var rotationMatrixY = mat4.create(rotationArrayY);

    //Calculating points B and C
    var b = vec3.create();
    mat4.multiplyVec3(rotationMatrixY, a, b);
    var c = vec3.create();
    mat4.multiplyVec3(rotationMatrixY, b, c);

    //The remaining point is the top point

    var vertices = new Array();

    //bottom
    vertices.push(a); vertices.push(b); vertices.push(c);
    //front
    vertices.push(b); vertices.push(c); vertices.push(d);
    //right
    vertices.push(c); vertices.push(a); vertices.push(d);
    //left
    vertices.push(a); vertices.push(b); vertices.push(d);

How should I imagine texturing these triangles? Is this a valid set of texture coordinates?

    var textureCoords = [
        //bottom
        0.5, 1.0,
        0.0, 0.0,
        1.0, 0.0,

        //front
        0.5, 1.0,
        0.0, 0.0,
        1.0, 0.0,

        //right
        0.5, 1.0,
        0.0, 0.0,
        1.0, 0.0,

        //left
        0.5, 1.0,
        0.0, 0.0,
        1.0, 0.0,
    ];

I based this on http://www.codeguru.com/forum/showpost.php?p=1542703&postcount=2:

  -------(0.5,1)-------
  |                   |
  |      Texture      |
  |      Image        |
  |                   | 
  |                   |
(0,0)---------------(1,0)

Thanks in advance!

share|improve this question

1 Answer 1

up vote 5 down vote accepted

The simple answer is: Whatever you want them to be. There isn't a "right answer" here.

In effect, you've asked a question like "I have a tetrahedron, what is the right color?" Nobody can give you a meaningful answer.

You'll need to rephrase the question in a way that can be answered, such as "What are the texture coordinates of the 'bottom' face if I wanted to map the lower half of an image divided along a line extending from the upper-left corner to the bottom-right using OpenGL?"

You're asking someone to type out texture coordinates, which is somewhat silly. Humans really don't do well with visualizing texture coordinates -> image relationships for anything more complicated than say a few triangles, and even then only if they form a simple and/or regular shape. This is why we have programs that allow us to visualize the changes without tediously typing out values.

Also, why does your tetrahedron have 5 faces? A tetrahedron has a triangular base and shares edges with 3 other triangular faces, who all share a common "top" vertex (and thus two edges each). If you've ever playing a pen & paper RPG such as Dungeons and Dragons, it is the canonical "four sided die". Just go Google Image Search "tetrahedron" to see what I mean.

At risk of sounding rude, I'd say it looks like this 'code' suffers from copy-paste syndrome. I think you need to take sometime out to read up on the fundamentals of texture mapping as a concept, maybe write some example that texture maps a single "flat" (parallel to screen) triangle to get some hands-on practice with it. Playing with a 3D editor's UV editor may help as well so you can see real-time changes as you modify the texture coordinates.

Best of luck.

share|improve this answer

Your Answer

 
discard

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.
{"cc_re__cc_re__cc_by_sa_3_0": ["                  <li><a href=\"//area51.stackexchange.com\" title=\"proposing new sites in the Stack Exchange network\">Area 51</a></li>\r\n                        <li><a href=\"//careers.stackoverflow.com\">Stack Overflow Careers</a></li>\r\n                    \r\n                </ol>\r\n            </td>\r\n    </tr>\r\n</table>\r\n                </div>\r\n            </div>\r\n\r\n            <div id=\"copyright\">\r\n                site design / logo &#169; 2015 stack exchange inc; user contributions licensed under <a href=\"http://creativecommons.org/licenses/by-sa/3.0/\" rel=\"license\">cc by-sa 3.0</a> \r\n                with <a href=\"http://blog.stackoverflow.com/2009/06/attribution-required/\" rel=\"license\">attribution required</a>\r\n            </div>\r\n            <div id=\"svnrev\">\r\n                rev 2015.5.22.2603\r\n            </div>\r\n            \r\n        </div>\r\n    </div>\r\n    <noscript>\r\n        <div id=\"noscript-warning\">Game Development Stack Exchange works best with JavaScript enabled<img src=\"http://pixel.quantserve.com/pixel/p-c1rF4kxgLUzNc.gif\" alt=\"\" class=\"dno\">"], "copyright__copyright__copyright": [" concept, maybe write some example that texture maps a single \"flat\" (parallel to screen) triangle to get some hands-on practice with it. Playing with a 3D editor's UV editor may help as well so you can see real-time changes as you modify the texture coordinates.\n\nBest of luck.\n\nshare|improve this answer\n\nYour Answer\n\n\u00a0\ndiscard\n\nBy posting your answer, you agree to the privacy policy and terms of service.\n\nNot the answer you're looking for? Browse other questions tagged or ask your own question."]}