How to "build" a triangle shape in the source code and paste a copy of it at sketch position (x,y)

KleinerBrandy

Hello everyone,

I am looking for a way to "build" a triangle shape (isosceles triangle) where I can specify the start point a (a1,a2), the length of the vertical direction towards the hypotenuse, and the length of the hypotenuse.

I then want to paste multiple triangles from that master shape into the sketch at positions I specify just with a point and the rotation of the triangle. For example 4 triangles in the middle of each side with the hypotenuse facing towards the middle of the sketch.

position1(  0 , height/2 ) with 90° rotation
position2( width/2 , 0 ) with 0° rotation
position3( width , height/2 ) with 180° rotation
position4( width/2 , height ) with 270° rotation

Any help is strongly appreciated.

Thanks a lot.

KleinerBrandy

Here's what I got so far. It's a version where I manually put down the triangles. I marked all positions I want triangles in with lines first and added one triangle to start with. But it all is very non-responsive towards changes I want to do later on maybe.

//VARS

void setup() {
  size(1920, 1080);        // HD
  //size(3840, 2160);      // U-HD
  //size(2048; 1080);      // 2K 16:9
  //size(4096; 2160);      // 4K 16:9
  background(20);
  stroke(200);
  strokeWeight(1);
  noLoop();
}

void draw(){

  int hori = width/20; //horizontal length of triangle
  int vert = height/20;
  int hypo = height/30; //length of half the hypotenuse

  int offset_x;
  int offset_y;


  triangle(0, height/3, hori, height/3-hypo, hori, height/3+hypo);

  line(0, height/3, width/20, height/3);
  line(0, height*2/3, width/20, height*2/3);
  line(width*19/20, height/3, width, height/3);
  line(width*19/20, height*2/3, width, height*2/3);

  line(width/3, 0, width/3, height/20);
  line(width*2/3, 0, width*2/3, height/20);
  line(width/3, height*19/20, width/3, height);
  line(width*2/3, height*19/20, width*2/3, height);
}

TfGuy44

void setup() {
  size(600, 400);          // A sane screen size.
  //size(1920, 1080);      // HD
  //size(3840, 2160);      // U-HD
  //size(2048; 1080);      // 2K 16:9
  //size(4096; 2160);      // 4K 16:9
  stroke(200);
  strokeWeight(1);
}

void draw() {
  background(20);
  tri(0, height/3, 0);
  tri(0, height*2/3, 0);
  tri(width, height/3, 180);
  tri(width, height*2/3, 180);
  tri(width/3, 0, 90);
  tri(width*2/3, 0, 90);
  tri(width/3, height, 270);
  tri(width*2/3, height, 270);
}

void tri( float atX, float atY, int degreesRot ) {
  int hori = width/20;
  int vert = height/40;
  pushMatrix();
  translate(atX, atY);
  rotate(radians(degreesRot));
  triangle(0, 0, hori, -vert, hori, vert);
  popMatrix();
}

KleinerBrandy

Thanks again, TfGuy44.

For the sake of learning, are there other possible ways to achieve that? I was looking into pshapes and... I think it was vertex(?) but wasn't sure how to approach the problem with those two.

As for your solution, let me try to follow what your code does:

line 26: puts the current matrix in the stack, aka everything that has been drawn so far is gone, I got an empty sketch

line 27: Does translate(x,y) move the point of origin of the coordinate system to the new coordinates?

line 28: rotate the empty sketch

line 29: put a triangle down at ( 0, 0, hori, -vert, hori, vert)

line 30: puts the old sketch back with the newly triangle, is it put on top or underneath?

GoToLoop

line 26: puts the current matrix in the stack, aka everything that has been drawn so far is gone, I got an empty sketch.

pushMatrix() merely saves current transformations (coord. system): :-B
https://Processing.org/reference/pushMatrix_.html

For "emptying" the canvas, call background() or clear(): ;)

1. https://processing.org/reference/background_.html
2. https://processing.org/reference/clear_.html

KleinerBrandy

If I want to make the background transparent, would

background(0,0,0,0);

work?

GoToLoop

https://Forum.Processing.org/two/discussion/20499/moving-a-translucent-window-around-the-screen#Item_8