Why is curveTightness acting so weird?

p5.js Coding Questions
1

https://editor.p5js.org/CarlyRaeJepsenStan/sketches/xH6tvmKep

Screenshot 2021-06-17 130541
Screenshot 2021-06-17 130541538×614 5.62 KB

I am applying curveTightness to a shape made out of points and curveVertex. For some reason, after a certain level of tightness on the curve, this strange thing develops on one of the points. Any idea what could be causing this?

2

CLOSE has strange behavior with curves. I would suggest drawing curves without using CLOSE and take note that when drawing open curves there will be no segment between the first and second, nor between the second to last and last, vertices. The first and last curveVertex() just act to control the shape of the subsequent or preceeding segment.

  beginShape();
  curveTightness(tightness);
  
  //starting from the upper left corner clockwise, the 
  //points are -,- ; +,- ; +,+ ; -,+
  /*
  // It's not clear why you were drawing the box separately as part of the same shape.
  vertex(a, c);
  vertex(b, c);
  vertex(b, d);
  vertex(a, d);
  */
  
  curveVertex(a, d);
  // No segment here
  curveVertex(a, c);
  // Top
  curveVertex(b, c);
  // Right
  curveVertex(b, d);
  // Bottom
  curveVertex(a, d);
  // Left
  curveVertex(a, c);
  // No Segment
  curveVertex(b, c);

  endShape();
1 Like
3

Thanks! I didn’t know you could define the curve only with curveVertex.