beginShape(args): tutorial or documentation of 'args'

edited May 2017 in Using Processing

I would like to see at least a brief summary of how to sequence the calls to vertex() to satisfy the different options for beginShape(option). option can be POINTS, LINES, etc., but I've found only rare examples in forum code postings -- always lacking any discussion. Thanks.

Answers

  • That doesn't really show the vertex ordering.

    It's based on the underlying opengl implementation so their documentation might help. I'm on my phone at the moment so it's hard to search for good links but here's one

    http://opengl.czweb.org/ch06/145-149.html

    Continues for the next few chapters after that to cover triangle fans and quad strips.

  • (actually reference does show vertex ordering but you need a pen and pencil to decode it)

  • Good hints. I think I can take it from there. Thanks.

  • edited May 2017

    oh, i thought the images in that link were small on my phone but they are just small, small to the point of being useless.

    for points / lines / triangles there's a decent picture here:

    http://www.informit.com/articles/article.aspx?p=2111395&seqNum=2

    here's one for everything else:

    http://glscene.pbworks.com/w/page/6437735/TMeshMode

    or figure 2.6 here

    https://perso.esiee.fr/~perrotol/TheRedBook-1.0/chapter02.html

  • These are all helpful links. Also helpful is the response to my related question which links to Shiffman's video:

    https://forum.processing.org/two/discussion/22371/how-to-create-mesh-add-color-or-texture-add-lighting-just-a-hint#latest

  • edited May 2017

    @koogs -- re:

    actually reference does show vertex ordering but you need a pen and pencil to decode it

    I have some notes I made that might help with vertex sequences, based on the beginShape reference examples:

    // points are discrete, one point per vertex
    beginShape(POINTS);
      // point A
      vertex(Ax, Ay);
      // point B
      vertex(Bx, By);
    endShape();
    
    // lines are discrete, one line per vertex pair
    beginShape(LINES);
      // line A
      vertex(Ax1, Ay1);
      vertex(Ax2, Ay2);
      // line B
      vertex(Bx1, By1);
      vertex(Bx2, By2);
    endShape();
    
    // triangles are discrete, one triangle per vertex triple
    beginShape(TRIANGLES);
      // triangle A
      vertex(Ax1, Ay1);
      vertex(Ax2, Ay2);
      vertex(Ax3, Ay3);
      // triangle B
      vertex(Bx1, By1);
      vertex(Bx2, By2);
      vertex(Bx3, By3);
    endShape();
    
    // triangle strips are connected
    // points are defined in a zig-zag pattern
    // with the first three points defining the first triangle
    // each new point adds a triangle sharing the previous two points
    beginShape(TRIANGLE_STRIP);
      // triangle A
      vertex(Ax1, Ay1);
      vertex(Ax2, Ay2);
      vertex(Ax3, Ay3);
      // triangle B
      vertex(Bx3, By3);
      // triangle C
      vertex(Cx3, Cy3);
      // triangle D
      vertex(Dx3, Dy3);
      // triangle E
      vertex(Ex3, Ey3);
    endShape();
    
    // triangle fans are connected
    // the first three points define a center, radius, and first triangle
    // each additional point adds a triangle sharing the previous and center point
    beginShape(TRIANGLE_FAN);
      // triangle A
      vertex(Ax1, Ay1); // center point
      vertex(Ax2, Ay2);
      vertex(Ax3, Ay3);
      // triangle B
      vertex(Bx3, By3);
      // triangle C
      vertex(Cx3, Cy3);
      // triangle D
      vertex(Dx3, Dy3);
      // triangle E
      vertex(Ex3, Ey3); 
    endShape();
    
    // quads are discrete, one quad per four vertices
    beginShape(QUADS);
      // quad A
      vertex(Ax1, Ay1);
      vertex(Ax2, Ay2);
      vertex(Ax3, Ay3);
      vertex(Ax4, Ay4);
      // quad B
      vertex(Bx1, By1);
      vertex(Bx2, By2);
      vertex(Bx3, By3);
      vertex(Bx4, By4);
    endShape();
    
    // quad strips are connected
    // the first four points define a quad
    // each additional pair of points adds a quad
    // the first quad is NOT given clockwise or counterclockwise
    // instead the points are defined in a zig-zag, like a triangle strip
    beginShape(QUAD_STRIP);
      // quad A
      vertex(Ax1, Ay1);
      vertex(Ax2, Ay2);
      vertex(Ax3, Ay3);
      vertex(Ax4, Ay4);
      // quad B
      vertex(Bx3, By3);
      vertex(Bx4, By4);
      // quad C
      vertex(Cx3, Cy4);
      vertex(Cx3, Cy4);
    endShape(); 
    
  • Perhaps your examples could be adapted for the beginShape() reference article.

    I did use pencil and paper to decipher current reference article and implemented this code which seems to have generated the desired 3D surface in top-to-bottom row sequence with grid pitch dX-by-dY:

        // Loop through columns drawing quad point pairs at row and row+1 
        for (j = 0; j < rows-1; j++) {
            beginShape(QUAD_STRIP);
            for (i = 0; i < cols; i++) {
                x  = i*dX;
                y1 = j*dY;
                y2 = y1 + dY;
                vertex(x, y1, s[i][j]);
                vertex(x, y2, s[i][j+1]);
            }
            endShape();
        }
    

    Thanks for your input jeremydouglass.

  • Answer ✓

    Based on @jeremydouglass observations, I build a small demo next.

    Kf

    boolean showGrid=false;
    
    void settings() {
      size(600, 400);
    }
    
    void setup() {
    
      textAlign(CENTER, CENTER);
      rectMode(CENTER);
    
      fill(255);
      textSize(16);
    }
    
    
    
    void draw() {
      background(150);
    
      if (showGrid==true) {
        stroke(0);
        strokeWeight(1);
        line(0, height/2, width, height/2);
        line(width/3, 0, width/3, height);
        line(2*width/3, 0, 2*width/3, height);
      }
    
      surface.setTitle("Mouse X,Y : "+mouseX%200+", "+mouseY%200);
    
      strokeWeight(5);
    
      pushMatrix();
      translate(0, 0);
      text("Points & Lines", 100, 100);
      // points are discrete, one point per vertex
      beginShape(POINTS);
      // point A
      vertex(40, 40);
      // point B
      vertex(50, 50);
      endShape();
    
      // lines are discrete, one line per vertex pair
      beginShape(LINES);
      // line A
      vertex(30, 30);
      vertex(60, 30);
      // line B
      vertex(30, 40);
      vertex(30, 60);
      endShape();
      popMatrix();
    
      pushMatrix();
      translate(200, 0);
      text("Triangles", 100, 100);
      // triangles are discrete, one triangle per vertex triple
      beginShape(TRIANGLES);
      fill(255, 0, 0);
      // triangle A
      vertex(30, 30);
      vertex(60, 30);
      vertex(30, 60);
      fill(0, 255, 0);
      // triangle B
      vertex(90, 90);
      vertex(60, 90);
      vertex(60, 60);
      endShape();
      popMatrix();
    
      pushMatrix();
      translate(400, 0);
      text("Triangle Strip", 130, 100);
      strokeWeight(1);
      // triangle strips are connected
      // points are defined in a zig-zag pattern
      // with the first three points defining the first triangle
      // each new point adds a triangle sharing the previous two points
      beginShape(TRIANGLE_STRIP);
      fill(255, 0, 0);
      // triangle A
      vertex(30, 30);
      vertex(60, 30);
      vertex(30, 60);
      fill(255);
      // triangle B
      vertex(30, 80);
      // triangle C
      vertex(60, 80);
      // triangle D
      vertex(45, 110);
      fill(0, 255, 0);
      // triangle E
      vertex(75, 110);
      endShape();
      popMatrix();
    
      pushMatrix();
      translate(0, 200 );
      text("Triangle Fan", 100, 100);
      // triangle fans are connected
      // the first three points define a center, radius, and first triangle
      // each additional point adds a triangle sharing the previous and center point
      beginShape(TRIANGLE_FAN);
      fill(255, 0, 0);
      // triangle A
      vertex(30, 60);// center point
      vertex(30, 30);
      vertex(60, 30);
      fill(255);
      // triangle B
      vertex(80, 60);
      // triangle C
      vertex(55, 75);
      // triangle D
      vertex(20, 90);
      fill(0, 255, 0);
      // triangle E
      vertex(5, 45); 
      endShape();
      popMatrix();
    
      pushMatrix();
      translate(200, 200 );
      text("Quads", 100, 100);
      // quads are discrete, one quad per four vertices
      beginShape(QUADS);
      fill(255, 0, 0);
      // quad A
      vertex(30, 30);
      vertex(60, 30);
      vertex(60, 60);
      vertex(45, 60);
      fill(0, 255, 0);
      // quad B
      vertex(180, 180);
      vertex(120, 180);
      vertex(120, 120);
      vertex(150, 120);
      endShape();
      popMatrix();
    
      pushMatrix();
      translate(400, 200 );
      text("Quad Strip", 100, 130);
      // quad strips are connected
      // the first four points define a quad
      // each additional pair of points adds a quad
      // the first quad is NOT given clockwise or counterclockwise
      // instead the points are defined in a zig-zag, like a triangle strip
      beginShape(QUAD_STRIP);
      fill( 255, 0, 0);
      // quad A
      vertex(30, 30);
      vertex(60, 30);
      vertex(30, 60);
      vertex(75, 60);
      fill(255);
      // quad B
      vertex(20, 75);
      vertex(110, 75);
      fill(0, 255, 0);
      // quad C
      vertex(30, 110);
      vertex(130, 125);
    
      endShape();
      popMatrix();
    }
    
    
    void mouseReleased() {
      showGrid=!showGrid;
    }
    
Sign In or Register to comment.