Jump to content


Member Since 05 Jul 2013
Offline Last Active Dec 14 2016 04:07 AM

Topics I've Started

Rotating object around its own center

13 December 2016 - 03:32 AM

I am trying to implement Blades of Waving Grass and I am still stuck at the point where I need to achieve texture arrangements like in the figure below (the first one).




So my plan is to draw the first texture, then draw the second and rotate it by 30°, then another and rotate it by 60° etc. Drawing the first texture is not a problem but I have some issues rotating the second one. I would expect it to look something like this (view from above):



Instead the actual result looks something like this:



Vertex and position data:

    GLfloat vertices[] = {
    	-0.5f, -0.5f, -0.5f, 0.0f, 0.0f,
    	0.5f, -0.5f, -0.5f, 1.0f, 0.0f,
    	0.5f, 0.5f, -0.5f, 1.0f, 1.0f,
    	0.5f, 0.5f, -0.5f, 1.0f, 1.0f,
    	-0.5f, 0.5f, -0.5f, 0.0f, 1.0f,
    	-0.5f, -0.5f, -0.5f, 0.0f, 0.0f,
    glm::vec3 texturePositions[] = {
    	glm::vec3(0.0f, 0.0f, 0.0f),
        glm::vec3(0.0f, 0.0f, 0.0f)

Camera/View transformations:

		// Camera/View transformation
		glm::mat4 view;
		view = camera.GetViewMatrix();
		// Projection
		glm::mat4 projection;
		projection = glm::perspective(glm::radians(camera.Zoom), (GLfloat)WIDTH / (GLfloat)HEIGHT, 0.1f, 1000.0f);
		// Get the uniform locations
		GLint modelLoc = glGetUniformLocation(ourShader.Program, "model");
		GLint viewLoc = glGetUniformLocation(ourShader.Program, "view");
		GLint projectionLoc = glGetUniformLocation(ourShader.Program, "projection");
		// Pass the matrices to the shader
		glUniformMatrix4fv(viewLoc, 1, GL_FALSE, glm::value_ptr(view));
		glUniformMatrix4fv(projectionLoc, 1, GL_FALSE, glm::value_ptr(projection));

Drawing the first two textures:

			//Texture 1
			glm::mat4 model;
			model = glm::translate(model, texturePositions[0]);			
			glUniformMatrix4fv(modelLoc, 1, GL_FALSE, glm::value_ptr(model));
			glDrawArrays(GL_TRIANGLES, 0, 6);

			//Texture 2
			GLfloat angle = glm::radians(30.0f);
			model = glm::translate(model, texturePositions[1]);
			model = glm::rotate(model, angle, glm::vec3(0.0f, 1.0f, 0.0f));
			glUniformMatrix4fv(modelLoc, 1, GL_FALSE, glm::value_ptr(model));
			glDrawArrays(GL_TRIANGLES, 0, 6);

As I am still in the very early learning process so I am kind of clueless here.

 1. I think that the order of transformations for the second texture is fine in my code, isn't it?
 2. Also how would I determine the right position for the object where the rotation would be applied correctly? (see above point 2)
 3. Might it be more efficient to apply the rotation in the objects local space? Is that possible in my case?

 4. If I change the rotation axis from y to z the object rotates around its own center just like expected.

 5. I also tried to apply the following solutions (taken from here and here) where I moved the object to glm::vec3(-x,-y,-z) rotate it and then moving it back to glm::vec3(x,y,z), unfortunately with no success. Which makes sence as the position   vector is set to (0,0,0) anyway. I also tried to change this position to something else than the origin also with no success.

I do not expect anybody to write code for me (though some snippet would be nice) but I would appreciate some hints or somebody pointing me in the right direction. I think that I have a basic fallacy here.

Thanks in advance.

Point around point rotation

15 August 2016 - 01:42 AM

Hey guys my goal is it to calculate the new coordinates of a point after rotating it around another point.

According to a thread this can be done using the following formula:




I verified that using pen and paper and it turned out well. Now I was going to implement the according function using the GLM library.

glm::vec2 rotate_point(glm::vec2 point_a, glm::vec2 point_b, GLfloat angle)
	GLfloat angle_radians = glm::radians(angle);
	GLfloat x = point_a.x + (point_b.x - point_a.x) * glm::cos(angle_radians) - (point_b.y - point_a.y) * glm::sin(angle_radians);
	GLfloat y = point_a.y + (point_b.x - point_a.x) * glm::sin(angle_radians) + (point_b.y - point_a.y) * glm::cos(angle_radians);

	return glm::vec2(x, y);

According to the documentation both glm::sin and glm::cos need the angle parameter to be in radians. For that reason I am using glm::radians to convert the angle to radians.

So here is where the problem occurs. The values which are returned by my function are not correct and I guess, it is because the cos and sin functions return wrong values (at least in my case).

How could I solve this issue? Are there any other functions in the glm-library which I didn't find or is there another, maybe mathematical approach to solve this problem?

Rendering same vertex-array in different modes

11 July 2016 - 09:10 AM

Hi folks here is my vertex array I am using:

    vertices = [
         -1.0, 1.0, 0.0,
        0.0, 1.0, 0.0,
        -0.5, 1.0, 0.0,
         0.5, 1.0, 0.0,
        1.0, 1.0, 0.0,
        1.0, 0.5, 0.0,
        0.0, 0.5, 0.0,
        0.5, 0.5, 0.0,
        -0.5, 0.5, 0.0,
        -1.0, 0.5, 0.0,

        -1.0, 0.0, 0.0,
        -0.5, 0.0, 0.0,
        0.0, 0.0, 0.0,
        0.5, 0.0, 0.0,
        1.0, 0.0, 0.0,

        -1.0, -0.5, 0.0,
        0.0, -0.5, 0.0,
        -0.5, -0.5, 0.0,
         0.5, -0.5, 0.0,
        1.0, -0.5, 0.0,
        1.0, -1.0, 0.0,
        0.0, -1.0, 0.0,
        0.5, -1.0, 0.0,
        -0.5, -1.0, 0.0,
        -1.0, -1.0, 0.0,

In a html-select I want to select a rendering mode and use it inmy drawScene-method:

    var renderModeSelector = document.getElementById("renderModeDropDown");
    var selectedRenderModeValue = renderModeSelector.options[renderModeSelector.selectedIndex].value;

    switch (selectedRenderModeValue) {
        case "0":
            gl.drawArrays(gl.POINTS, 0, squareVertexPositionBuffer.numItems);
        case "1":
            gl.drawArrays(gl.TRIANGLE_FAN, 0, squareVertexPositionBuffer.numItems);
        case "2":
            gl.drawArrays(gl.LINE_LOOP, 0, squareVertexPositionBuffer.numItems);
            console.log("No rendering mode selected.");


  1. Case '0' is supposed to draw the points which works fine



  1. Case '1' should draw a filled rectangle, with the shader below. Unfortunately it is messed up, see also in the picture below.

Fragment shader:

    precision mediump float;

    varying vec4 vColor;

    void main(void) {
    gl_FragColor = vColor;


    attribute vec3 aVertexPosition;
    attribute vec4 aVertexColor;

    uniform mat4 uMVMatrix;
    uniform mat4 uPMatrix;

    varying vec4 vColor;

    void main(void) {
    gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0);
    vColor = aVertexColor;
    gl_PointSize = 5.0;



3. And finally in case '2' it is supposed to draw only the outlines, which also does not work as expected, see below.




So I wonder if it is possible to meet my requirements while using one vertexPositionBuffer. Also if it is not what would be another appropriate solution? Should I create another vertexPositionBuffer or can I just change mine "on the fly", before rendering?


Triangle rendered white only.

09 February 2016 - 04:02 AM

Hi folks,

I am following in2gpu's tutorials on modern OpenGL. The goal is to render a triangle. Everything worked fine so far, except for the color. The authors triangle has three color defined which makes the fragment shader render the triangle in different colors.  Although I strictly followed the tutorial my triangle is colored in a flat white.


The project now contains several classes which are responsible for freeglut and glew initialization. I also have a Vertex- and a Fragmentshader which look like this:



#version 330 core
layout(location = 0) in vec3 in_position;
layout(location = 1) in vec4 in_color;

out vec4 color;

void main(){

	color = in_color;
	gl_Position = vec4(in_position, 1);


#version 330 core

layout(location = 0) out vec4 out_color;

in vec4 color;

void main(){
 	out_color = color;

So the first thing to mention here is I am using version 330 while the author uses version 450 and I am not sure whether this is crucial here. Also there might be another source for the problem. I am using Visual Studio 2015 which does not seem to know .glsl-files. I created the shaders by adding a new Item. Here I chose a Pixel Shader File (.hlsl) and renamed it to .glsl. This did raise the following Error:



The "ConfigurationCustomBuildTool" rule is missing the "ShaderType" property.


I am able to build and run the project though, without errors. Also here is the Triangle class itself:



#include "Triangle.h"


	//is going to be deleted in Models.cpp (inheritance)

void Triangle::Create()
	GLuint vao;
	GLuint vbo;


	std::vector<VertexFormat> vertices;

	glBufferData(GL_ARRAY_BUFFER,sizeof(VertexFormat) * 3, &vertices[0],GL_STATIC_DRAW);
	//you can use offsetof to get the offset of an attribute
	//here we assign the values
	this->vao = vao;

void Triangle::Update()
	//Triangle does not have to be updated

void Triangle::Draw()


Although it seems that I followed the tutorial all the way, my triangle is still rendered white only. The are of course a lot more classes but I guess I should not post the entire project here. I can always post some additional information if it is needed. At the end it seems to me that something is wrong with the fragment shader. I also described my problem to the author. he could not have a look into my code/project but he suspected that there is something wrong with my attributes.


I am very new to both C++ and OpenGL therefore it is very difficult for me to debug (if it is even possible for shaders).


Glad for any help and thanks in advance!



How is persistence managed by browser games?

18 November 2015 - 02:06 AM

I was wondering,


when you play browser games you never seem to witness a page refresh, even if there is data being stored on the server. So how are databases handled by browser games.


In my opinion there are several possible scenarios:


1. Data is being modified during your absence. Let's say in FarmVille your plants will grow while you are not using the application. So is this data being constantly updated on the server or does the application calculate everything that might have happened in a fast forward when you launch it?


2. Let's say you are currently playing in the browser and you completed a mission and get a coin reward or something. Is this data-update instantly written to a database or is it somehow stored in some kind of session tracker (cookies?) and stored on the server once you leave the application?



              2.1 If it is written to the server instantly how is this done without a page refresh? I mean if there is some kind of client/server communication there must be a page refresh right?


              2.2 If the data is send to the server once you leave the application, how to handle a case where the user simply kills the browser process by simply closing it? Can this scenario be catched by code so the data can still be written?