# How to draw a "three-quarter circle"?

I am trying to draw the following in a Processing sketch:

The lines are no problem, but I am searching for a way to implement the curves by also just using vertexes. Ideally, I would just have to tell the code the positions of the (in this case) top, bottom and left. I’ve tried using `curveVertex` to get a circle shape as a base, but couldn’t get that to work. My code:

``````void draw() {
beginShape();
curveVertex(50, 50);
curveVertex(50, 50);
curveVertex(100, 100);
curveVertex(50, 150);
curveVertex(0, 100);
curveVertex(0, 100);
endShape();
}
``````

The result:

Does anybody know a way to approach this?

2 Likes

Hello @Schred,

You can use arc() to do this:

https://processing.org/reference/arc_.html

7 Likes

Thanks, I’ll have a look at that later today!

Edit: Yep, that’s what I was looking for. Thanks!

2 Likes

If you want to “roll your own” and not use `arc()`, then the formula is not to hard for circle coordinates – `radius*cos(a)` and `radius*sin(a)` for a point at angle `a`.

To draw line segments, loop over the points and draw a line between the previous point and the next.

``````void myarc(float radius, float arcsize, float step) {
line(0, 0, radius, 0);
for (float angle=step; angle<=arcsize; angle+=step) {
float x1 = radius*cos(angle-step);
float y1 = radius*sin(angle-step);
float x2 = radius*cos(angle);
float y2 = radius*sin(angle);
line(x1, y1, x2, y2);
if (angle+step>arcsize) line(0, 0, x2, y2);
}
}
``````

This also lets you get more creative, for example, varying line thickness or color, or drawing shapes at the points.

``````/**
* create your own simple arc drawing function
* ( rather than using the built-in `arc()` )
* 2020-09-16 Processing 3.5.4
*/
void setup() {
size(900, 300);
strokeWeight(2);
}

void draw() {
background(255);
translate(width/6.0, height/2.0);
myarc(140, TWO_PI*0.75, 0.025);
translate(width/3.0, 0);
myarc(140, TWO_PI*(mouseX/(float)width), 0.025);
translate(width/3.0, 0);
myarc2(140, TWO_PI*(mouseX/(float)width), 0.1);
}

void myarc(float radius, float arcsize, float step) {
line(0, 0, radius, 0);
for (float angle=step; angle<=arcsize; angle+=step) {
float x1 = radius*cos(angle-step);
float y1 = radius*sin(angle-step);
float x2 = radius*cos(angle);
float y2 = radius*sin(angle);
line(x1, y1, x2, y2);
if (angle+step>arcsize) line(0, 0, x2, y2);
}
}

void myarc2(float radius, float arcsize, float step) {
for (float angle=step; angle<=arcsize; angle+=step) {
float x1 = radius*cos(angle);
float y1 = radius*sin(angle);
ellipse(x1, y1, 10, 10);
}
}
``````

4 Likes
``````int i;
float j;
boolean closed;

void setup() {
size(600, 400);
background(0);
noStroke();
}

void draw() {
fill (0);
ellipse (i-1, 200, 210, 210);
fill(255, 255, 0);
arc(i, 200, 200, 200, j, 6);
i += 4;
if (j > 0.6) closed = true;
if (!closed ) j += 0.05;
else j -= 0.05;
if (j < 0) closed = false;
if (i > 700) i = 0;
}
``````
3 Likes

or you could…

``````size(300,300);
background(195);
fill(255);
stroke(0);
strokeWeight(2);
circle(width/2,height/2,150);
fill(196);
rect(width/2,height/2-150,150,150);
noStroke();
rect(width/2-1,height/2-226,200,150);
rect(width/2+77,height/2-75,150,150);
``````

4 Likes

Ha! Well, it worked

1 Like

Here’s my attempt. Not exactly the best algorithm, but will give you another option to choose from.

``````void setup() {
size(500, 500, P2D);
background(230, 140, 140);
pacMan(width/2, height/2, 100, 180, 5);
}

void pacMan(float x1, float y1, float radius, int precision, int thickness) {
beginShape();
strokeWeight(thickness);

for (float a = 0; a <= PI+HALF_PI; a += TWO_PI/precision) {
float x2 = x1 + (cos(a) * radius);
float y2 = y1 + (sin(a) * radius);
vertex(x2, y2);
}

vertex(x1, y1);
endShape(CLOSE);
}
``````
3 Likes

Haha, thank you all for your suggestions! Really appreciate it!