How would you draw a triangle and arc so that the center of the shape is where your mouse is? (using mouseX and mouseY) and how would you change the size of the triangle and arc?
i Lore,
There are plenty of triangles possible: equilateral, isoceles, right-angled, and so much more that does not have names… and there are also many ways to orient it!
I’m saying that because what you gave us is not enough to really understand what you really want to do. Based on the kind of triangle you want to draw the code can be really simple because we are in a specific case were general formulas simplify or, on the opposite, if you want it to work with any triangles then you would need to do a bit more calculus.
The same goes with your arc, you don’t even know were you want the arc to be.
So please, try to be a bit more specific, maybe even put some pic so we really understand what you want to do.
1 Like
Sorry for not being specific earlier! 
The type of triangle that I would like is an equilateral triangle that is facing up like in the picture.
Now I have written some code but it doesn’t “look” like it is in the center.
triangle(mouseX+size, mouseY+size, mouseX, mouseY-size, mouseX-size, mouseY+size);
For my arc I was looking for one semi circular shaped like in the picture. I have not found any way close of getting my mouse to be in the center. This is the closest that I got.
arc(mouseX, mouseY-(size/3), size, size, 0, PI, CHORD);
1 Like
If you have some code, take the habit of posting it, even if you can’t manage to do what you want because it is always a nice starting point.
Concerning the triangle, luckily for you in an equilateral triangle the centre of gravity, the orthocenter, the center of the inscribed center and the center of the circumscribed center are the same. So the definition of center doesn’t really matter.
The way I would do it is simply take a distance d, and use trigonometry to get the coordinate of each point: one is with no rotation and the 2 others should be rotated by ±2*PI/3. So something like this:
float d = 50;
void setup() {
size(500, 500);
}
void draw() {
noFill();
stroke(200);
background(20);
myTriangle(mouseX, mouseY);
}
void myTriangle(float cx, float cy) {
float x1 = d;
float y1 = 0;
float x2 = d * cos(TWO_PI / 3);
float y2 = d * sin(TWO_PI / 3);
float x3 = d * cos(-TWO_PI / 3);
float y3 = d * sin(-TWO_PI / 3);
pushMatrix();
translate(cx, cy);
rotate(-PI/2);
triangle(x1, y1, x2, y2, x3, y3);
popMatrix();
}
1 Like
For you arc shape, I presume that you are speaking of the center of mass (or centroid).
In this case, a simple search on google gave me this result:
Based on that you can see that the centroid of half a circle is given by:
- y = 4r/3PI
- x = 0
Where r is the radius of the full circle.
Knowing that the rest is quite simple:
float d = 50;
void setup() {
size(500, 500);
}
void draw() {
noFill();
stroke(200);
background(20);
myArc(mouseX, mouseY);
}
void myArc(float cx, float cy) {
float r = d / 2;
float yOffset = (4*r) / (3*PI);
pushMatrix();
translate(cx, cy - yOffset);
arc(0, 0, d, d, 0, PI, CHORD);
popMatrix();
}
1 Like
for change the size could use the mouse wheel,
add to above example from @jb4x
//_________________________________________________________________ mouseWheel
void mouseWheel(MouseEvent event) {
d += event.getCount();
}
2 Likes
