# Arc 2D shape from circle attributes

Hello everyone, I am trying to make this 2D shape to be extruded using ExtrudeGeometry. However, I can’t a way to make the shape. I have circle center, circle radius, start and end angle of the arc.

I tried the following:

``` var r = this.circle.r; var rInner = this.circle.r - 100; var cx = this.circle.x; var cy = this.circle.y; var antiClockwise = true; shape.moveTo( cx + (rInner * Math.cos(this.sAngle)), cy +(rInner * Math.sin(this.sAngle)) ); shape.lineTo(cx + (r * Math.cos(this.sAngle)),cy + (r * Math.sin(this.sAngle))); shape.arc( cx, cy, r, this.sAngle, this.eAngle, antiClockwise ); shape.lineTo(cx + (rInner * Math.cos(this.eAngle)),cy + (rInner * Math.sin(this.eAngle))); shape.arc( cx, cy, rInner, this.eAngle, this.sAngle, !antiClockwise ); var geo = new ShapeGeometry(shape); ```

Which is producting this:

Any ideas how to fix it would be really appreciated.

Seems, it’s enough to do it this way: https://jsfiddle.net/prisoner849/ovrf9mqL/

``````var R =  5;
var r =  R - 1;
var cx = 1;
var cy = 2;

let shape = new THREE.Shape();

shape.absarc(cx, cy, R, sAngle, eAngle);
shape.absarc(cx, cy, r, eAngle, sAngle, true);
``````

2 Likes

Thank you! exactly what I needed.

You’re welcome

1 Like

Prisoner849 to the rescue!
Very useful!

2 Likes