Graphics drawn ofFbo on mesh are distorted (by triangles(?))

So I’m drawing an ofFbo to an ofMesh and the graphics i draw to mesh are distorted in the center when I move the vertices around. I’m using an easycam for debugging. Aiming for the graphics not to be distorted.

Setup code:

    fbo.allocate(1920, 1080, GL_RGBA);
    fbo.begin();
    fbo.end();

//    plane.set(1920/2, 1080/2, 2, 2);
//    pMesh = plane.getMesh();

    for(int i = 0; i < 4; i++){
        pMesh.addVertex(sharedState->proPoints[i]);
        pMesh.addTexCoord(ofVec2f(sharedState->proPoints[i].x, sharedState->proPoints[i].y));
    }


    pMesh.addTriangle(0, 1, 2);
    pMesh.addTriangle(3, 0, 2);


Draw code:

    ofBackground(200, 100, 200);
    ofEnableDepthTest();
    cam.begin();

    ofPushMatrix();
    ofRotateXDeg(-180);
    ofTranslate(-1920/2, -1080/2, 0);
    fbo.getTexture().bind();
    pMesh.draw();
    fbo.getTexture().unbind();

    ofPopMatrix();

    cam.end();
}

Update code:
Here i am updating the vertices with variables from a global shared pointer, as well as drawing the graphics in the ofFbo.

    fbo.begin();
    ofClear(0,0,0);
    ofBackground(200);
    for(int i = 0; i < sharedState->num_colours; i++){
        //sharedState->contourFinders[i].draw();
        boundingRects = sharedState->contourFinders[i].getBoundingRects();
        for(unsigned int j = 0; j < boundingRects.size(); j++){
            cv::Point2f p_;
            p_ = sharedState->contourFinders[i].getCenter(j);
            ofSetColor(255,100,255);
            //ofDrawCircle(p_.x, p_.y, 10, 10);
            ofDrawCircle(ofMap(p_.x,0, 640, 0, 1920),ofMap(p_.y, 0, 480, 0, 1080), 10, 10);
        }
    }
    ofDrawCircle(mouseX, mouseY, 50);
    fbo.end();

    for(int i = 0; i < 4; i++){
        pMesh.setVertex(i, sharedState->proPoints[i]);
    }

In the picture there is an ofDrawCircle being drawn in the ofFbo being drawn to the mesh.

I would like the graphics to be skewed on the plane not across this diagonal as shown in the screenshot.

Thanks :upside_down_face:

Hi @C1harlieL,

I think you can try to add the tex Coords a little differently, without specifying it for each vertex :
just put :

addTexCoord(0,0)
// [...]
// once finished with adding vertices : 
 for(int i = 0; i < 4; i++){
        pMesh.addVertex(sharedState->proPoints[i]);
}

addTexCoord(maxTex.x, maxTex.y);

with maxTex an ofVec2f containing the max values of the texture.
That way the texture is just bind to top left and bottom right of the texture.

Also it is possible that the texture you are drawing is flipped for one of the triangles, so for example the bottom half of the circle is drawn at the top and gives it the skewed shape you see.
If you can post the vals of the propoints that would help - although you have already extensively posted code for it :slight_smile: .

Hope this helps,

Best,

P