Using Shapes in p5.js

p5.js Coding Questions
1

Hi there -

I’m newish to Processing and looking to get a sketch up and running.
Using Example 03: Objects Array from the Examples Folder, I’d like to replace the “ellipse” with a tailored “createShape” - but it doesn’t seem to be working. I’d appreciate if someone could tell me where I’ve gone wrong.

class Jitter {
  constructor() {
    this.x = random(width);
    this.y = random(height);
    this.diameter = random(10, 30);
    this.speed = 1;
  }

  move() {
    this.x += random(-this.speed, this.speed);
    this.y += random(-this.speed, this.speed);
  }

  display() {
    var s =  createShape();
    s.beginShape(TRIANGLE_FAN);
    s.strokeWeight(random(0.28));
    s.vertex(100, -30);
    s.vertex(90, 20);
    s.vertex(3, -100)
    s.endShape(CLOSE);
  }
}
1 Like
2

Hi @bcabc,

I assume you are using p5js (JavaScript) and not Processing (Java) so there is no createShape() function in the reference.

One solution is to only use beginShape() and endShape():

beginShape(TRIANGLE_FAN);
strokeWeight(random(0.28));
vertex(100, -30);
vertex(90, 20);
vertex(3, -100)
endShape(CLOSE);
2 Likes