How to set a specific eye point using perspective view with matrices

Question

currently I am learning 3D rendering theory with the book "Learning Modern 3D Graphics Programming" and are right now stuck in one of the "Further Study" activities on the review of chapter four, specifically the last activity.

The third activity was answered in this question, I understood it with no problem. However, this last activity asks me to do all that this time using only matrices.

I have a solution partially working, but it feels quite a hack to me, and probably not the correct way to do it.

My solution to the third question involved oscilating the 3d vector E's x, y, and z components by an arbitrary range and produced a zooming-in-out cube (growing from bottom-left, per OpenGL origin point). I wanted to do this again using matrices, it looked like this:

  

  

However I get this results with matrices (ignoring the background color change):

  

  

Now to the code...

The matrix is a float[16] called theMatrix that represents a 4x4 matrix with the data written in column-major order with everything but the following elements initialized to zero:

float fFrustumScale = 1.0f; float fzNear = 1.0f; float fzFar = 3.0f;

theMatrix[0] = fFrustumScale;
theMatrix[5] = fFrustumScale;
theMatrix[10] = (fzFar + fzNear) / (fzNear - fzFar);
theMatrix[14] = (2 * fzFar * fzNear) / (fzNear - fzFar);
theMatrix[11] = -1.0f;

then the rest of the code stays the same like the matrixPerspective tutorial lesson until we get to the void display()function:

//Hacked-up variables pretending to be a single vector (E)
float x = 0.0f, y = 0.0f, z = -1.0f;

//variables used for the oscilating zoom-in-out
int counter = 0;
float increment = -0.005f;
int steps = 250;

void display()
{
    glClearColor(0.15f, 0.15f, 0.2f, 0.0f);
    glClear(GL_COLOR_BUFFER_BIT);

    glUseProgram(theProgram);

    //Oscillating values
    while (counter <= steps)
    {
        x += increment;
        y += increment;
        z += increment;

        counter++;

        if (counter >= steps)
        {
            counter = 0;
            increment *= -1.0f;
        }
        break;
    }

    //Introduce the new data to the array before sending as a 4x4 matrix to the shader
    theMatrix[0] = -x * -z;
    theMatrix[5] = -y * -z;

    //Update the matrix with the new values after processing with E
    glUniformMatrix4fv(perspectiveMatrixUniform, 1, GL_FALSE, theMatrix);

    /*
    cube rendering code ommited for simplification
    */

glutSwapBuffers();
glutPostRedisplay();
}

And here is the vertex shader code that uses the matrix:

#version 330

layout(location = 0) in vec4 position;
layout(location = 1) in vec4 color;

smooth out vec4 theColor;

uniform vec2 offset;
uniform mat4 perspectiveMatrix;

void main()
{
        vec4 cameraPos = position + vec4(offset.x, offset.y, 0.0, 0.0);

        gl_Position = perspectiveMatrix * cameraPos;
        theColor = color;
} 

What I am doing wrong, or what I am confusing? Thanks for the time reading all of this.

Answer 1

In OpenGL there are three major matrices that you need to be aware of:

• The Model Matrix D: Maps vertices from an object's local coordinate system into the world's cordinate system.

• The View Matrix V: Maps vertices from the world's coordinate system to the camera's coordinate system.

• The Projection Matrix P: Maps (or more suitably projects) vertices from camera's space onto the screen.

• Mutliplied the model and the view matrix give us the so called Model-view Matrix M, which maps the vertices from the object's local coordinates to the camera's cordinate system.

  

  

  Altering specific elements of the model-view matrix results in certain afine transfomations of the camera.

  For example, the 3 matrix elements of the rightmost column are for the translation transformation. The diagonal elements are for the scaling transformation. Altering appropriately the elements of the sub-matrix

  

  are for the rotation transformations along camera's axis X, Y and Z.

---

The above transformations in C++ code are quite simple and are displayed below:

  void translate(GLfloat const dx, GLfloat const dy, GLfloat dz, GLfloat *M)
  {
    M[12] = dx; M[13] = dy; M[14] = dz;
  }

  void scale(GLfloat const sx, GLfloat sy, GLfloat sz, GLfloat *M)  
  {
    M[0] = sx; M[5] = sy; M[10] = sz;
  }

  void rotateX(GLfloat const radians, GLfloat *M)  
  {
    M[5] = std::cosf(radians); M[6]  = -std::sinf(radians);
    M[9] = -M[6];              M[10] = M[5];
  }

  void rotateY(GLfloat const radians, GLfloat *M)  
  {
    M[0] = std::cosf(radians); M[2]  = std::sinf(radians);
    M[8] = -M[2];              M[10] = M[0];
  }

  void rotateZ(GLfloat const radians, GLfloat *M)  
  {
    M[0] = std::cosf(radians); M[1] = std::sinf(radians);
    M[4] = -M[1];              M[5] = M[0];
  }

---

Now you have to define the projection matrix P.

• Orthographic projection:

---

// These paramaters are lens properties.
// The "near" and "far" create the Depth of Field.
// The "left", "right", "bottom" and "top" represent the rectangle formed
// by the near area, this rectangle will also be the size of the visible area.
GLfloat near   = 0.001, far   = 100.0;
GLfloat left   = 0.0,   right = 320.0; 
GLfloat bottom = 480.0, top   = 0.0;

// First Column
P[0] = 2.0 / (right - left);
P[1] = 0.0;
P[2] = 0.0;
P[3] = 0.0;

// Second Column
P[4] = 0.0;
P[5] = 2.0 / (top - bottom);
P[6] = 0.0;
P[7] = 0.0;

// Third Column
P[8] = 0.0;
P[9] = 0.0;
P[10] = -2.0 / (far - near);
P[11] = 0.0;

// Fourth Column
P[12] = -(right + left) / (right - left);
P[13] = -(top + bottom) / (top - bottom);
P[14] = -(far + near) / (far - near);
P[15] = 1;

---

• Perspective Projection:

---

// These paramaters are about lens properties.
// The "near" and "far" create the Depth of Field.
// The "angleOfView", as the name suggests, is the angle of view.
// The "aspectRatio" is the cool thing about this matrix. OpenGL doesn't
// has any information about the screen you are rendering for. So the
// results could seem stretched. But this variable puts the thing into the
// right path. The aspect ratio is your device screen (or desired area) width
// divided by its height. This will give you a number < 1.0 the the area 
// has more vertical space and a number > 1.0 is the area has more horizontal 
// space. Aspect Ratio of 1.0 represents a square area.
GLfloat near        = 0.001;
GLfloat far         = 100.0;
GLfloat angleOfView = 0.25 * 3.1415;
GLfloat aspectRatio = 0.75;

// Some calculus before the formula.
GLfloat size   =  near * std::tanf(0.5 * angleOfView); 
GLfloat left   = -size
GLfloat right  =  size;
GLfloat bottom = -size / aspectRatio;
GLfloat top    =  size / aspectRatio;

// First Column
P[0] = 2.0 * near / (right - left);
P[1] = 0.0;
P[2] = 0.0;
P[3] = 0.0;

// Second Column
P[4] = 0.0;
P[5] = 2.0 * near / (top - bottom);
P[6] = 0.0;
P[7] = 0.0;

// Third Column
P[8]  = (right + left) / (right - left);
P[9]  = (top + bottom) / (top - bottom);
P[10] = -(far + near) / (far - near);
P[11] = -1.0;

// Fourth Column
P[12] = 0.0;
P[13] = 0.0;
P[14] = -(2.0 * far * near) / (far - near);
P[15] = 0.0;

---

Then your shader will become:

---

#version 330

layout(location = 0) in vec4 position;
layout(location = 1) in vec4 color;

smooth out vec4 theColor;

uniform mat4 modelViewMatrix;
uniform mat4 projectionMatrix;

void main()
{
  gl_Position = projectionMatrix * modelViewMatrix * position;
  theColor    = color;
} 

---

Bibliography:

http://blog.db-in.com/cameras-on-opengl-es-2-x/

http://www.songho.ca/opengl/gl_transform.html

---