How to make an increasingly thicker line?

edited June 2017 in How To...

lets say i draw a line

line(0,0, width, height);

is there some way to make this line increase in thickness from 0,0 along the diagonal to width, height say from thickness 1 to thickness 4.

strokeWeight seems to want to apply thickness to a whole line, but what i'm essentially looking for is gradient thickness. any ways to do this natively, or perhaps with a shader, or perhaps some other hacky way?

Tagged:

Answers

  • Answer ✓
    void setup(){
    size(200,200);
    }
    
    void draw(){
      background(0);
      stroke(255);
      thickeningLine(10,10,190,190,1,15);
    }
    
    void thickeningLine(float sx, float sy, float ex, float ey, int sws, int swe){
      int dsw = int(swe - sws);
      float amt = 1.0/dsw;
      for(int i = 0; i < dsw; i++){
        strokeWeight(sws+i);
        line(lerp(sx,ex,i*amt),lerp(sy,ey,i*amt),lerp(sx,ex,(i+1)*amt),lerp(sy,ey,(i+1)*amt));
      }
    }
    
  • edited June 2017

    A hacky way is to draw multiple lines.

    void draw() {
      background(204);
      thickline(10, 10, width-10, height-10, 7);
    }
    
    void thickline(float x1, float y1, float x2, float y2, int s2) {
      for (int i=-s2/2; i<s2-s2/2; i++) {
        line(x1, y1, x2, y2 + i);
      }
    }
    

    ...ah, missed that TfGuy44 had already done this!

  • edited June 2017

    -slowpoke image-

  • Have you tried drawing a trapezium with quad()?

  • @GKFX -- that's a really good idea.

Sign In or Register to comment.