Coordinate ranges from CreateShape (customized shape)

Processing Coding Questions
1

Hello Everyone,

I am trying to recreate a basic poster with some randomness on the triangles and arcs (on key pressed).
The range in which the shapes can move is the full length of the screen’s width and height/2. However, I would like to keep the shapes within a custom range (Blue stroke on the attached image)

image
image1042×947 68.7 KB

My code is using the width and height range to place the shapes:

//PShape mask;

void setup() {
  size(630, 800);
  noLoop();
  //mask = createShape(ELLIPSE, width/2, height/2, 150);
}//closing setup 


void draw() {
   background(#dddddd); 

//drawing 6 arcs and triangles from origin and then translating
  for (int i= 0; i < 6; i++) {
    fill(0);
    noStroke();
    pushMatrix();
    **translate(random(width), random(height/2));**
    rotate(random(-PI/10, PI/10));
    triangle(0, 0, 50, 100, -50, 100);
    popMatrix();
    
    fill(#eeeeee);
    pushMatrix();
    **translate(random(width), random(height/2));**
    rotate(random(TWO_PI));
    arc( 0, 0, 100, 100, 0, PI+QUARTER_PI, CHORD);
    popMatrix();
  }
}//close draw function

void keyPressed() {
  redraw();
}

I was thinking of creating a customised shape, using createShape() and then proceeding to draw the shape with vertex. However, such variable would be a PShape, which can’t be used within the random() function.

Is it possible to draw the shape and then extract the values that I need for my range? or would I need to manually set every coordinate to create the range in which I want my shapes to appear?

Thank you !

2

Hi @DianaG,

Welcome to the forum! :wink:

Basically you want to do multiple things:

  • Draw the polygonal blue shape which you can draw with beginShape(), endShape() and vertex() by having the coordinates of the polygon. You might want to store the coordinates of each vertex in an array.

  • You want to randomly place a shape in the polygon which requires you to choose a random point within that polygon. To do that see a possible implementation or this SO thread.

    The idea is to triangulate the polygon and then sample a random point in a weighted triangle based on the surface ratio it occupies.

  • Lastly if you don’t want your shape to intersect with the polygon you’ll need to find a way to detect intersection with the polygon and the shape. For simple shapes it’s possible for more complex shapes it can be more difficult… (this step is not mandatory since triangles can overlap and it doesn’t matter)