# P5.js TWO\_PI not working?

**URL:** <https://discourse.processing.org/t/p5-js-two-pi-not-working/9439>\
**Category:** Beginners\
**Created:** [March 19, 2019, 1:03pm UTC](https://discourse.processing.org/t/p5-js-two-pi-not-working/9439 "2019-03-19T13:03:20Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Code\_Caffeine](https://avatars.discourse-cdn.com/v4/letter/c/2acd7d/32.png) [@Code\_Caffeine](https://discourse.processing.org/u/Code_Caffeine)\
**Post date:** [March 19, 2019, 1:03pm UTC](https://discourse.processing.org/t/p5-js-two-pi-not-working/9439/1 "2019-03-19T13:03:20Z")

</div>

I am trying to make a clock in `p5.js` after watching the Coding Train video on the topic. However, when I try to create an arc, the angle `TWO_PI` produces no output, where I expect a full circle. Every other angle I have tried has produced the expected fraction of a full circle, but the two angles corresponding to the full circle don’t seem to be working.

My code that I used to attempt to replicate this is as follows:

```auto
function setup() 
{
  createCanvas(400, 400);
// angleMode(DEGREES);
  angleMode(RADIANS);
}

function draw() 
{
// background(220);
// let angle = 270;
// let m = map(angle, 0, 360, mouseX, mouseY, true);
 
  arc(width/2, height/2, 200, 200, 0, TWO_PI);
  strokeWeight(4);
  stroke(255);
  noLoop();
  
// arc(width/2, height/2, 200, 200, 0, TWO_PI);
}

```

This problem also occurs when the angle mode is DEGREES and the ending angle is 360.  
Removing the `angleMode()` command seems to solve this problem, but then how does `p5` know what angle mode you’re in?

Any help with this issue is appreciated.

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [March 19, 2019, 2:02pm UTC](https://discourse.processing.org/t/p5-js-two-pi-not-working/9439/2 "2019-03-19T14:02:07Z")

</div>

> **[reference | p5.js](https://p5js.org/reference/#/p5/arc)**
>
> p5.js a JS client-side library for creating graphic and interactive experiences, based on the core principles of Processing.

> Note that drawing a full circle (ex: 0 to TWO\_PI) will appear blank because 0 and TWO\_PI are the same position on the unit circle. The best way to handle this is by using the [ellipse()](https://p5js.org/reference/#/p5/ellipse) function instead to create a closed ellipse, and to use the [arc()](https://p5js.org/reference/#/p5/arc) function only to draw parts of an ellipse.

but i recommend

```auto
  arc(width/2, height/2, 200, 200, 0, TWO_PI-0.001);

```

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [March 22, 2019, 4:02pm UTC](https://discourse.processing.org/t/p5-js-two-pi-not-working/9439/3 "2019-03-22T16:02:30Z")

</div>

One approach is to limit your range, as @kll suggested:

```
let angle = map(mouseX, 0, width, 0, TWO_PI-.0001, true);
arc(width/2, height/2, 200, 200, 0, angle);

```

Another is to special-case the TWO\_PI value, drawing it with an ellipse instead. Here is an example of that:

```auto
function setup() 
{
  createCanvas(400, 400);
  angleMode(RADIANS);
}
function draw() 
{
  background(220);
  let angle = map(mouseX, 0, width, 0, TWO_PI, true);
  if (angle==TWO_PI) {
    stroke(255, 0, 0);
    ellipse(width/2, height/2, 200, 200);
  } else {
    stroke(0);
    arc(width/2, height/2, 200, 200, 0, angle);
  }
}

```

---

<div class="post-metadata">

**Author:** ![ZachMcMkay](https://avatars.discourse-cdn.com/v4/letter/z/8e7dd6/32.png) [@ZachMcMkay](https://discourse.processing.org/u/ZachMcMkay)\
**Post date:** [March 31, 2019, 4:39pm UTC](https://discourse.processing.org/t/p5-js-two-pi-not-working/9439/4 "2019-03-31T16:39:05Z")

</div>

I believe your issue is that you are telling the arc function to start at 0 and then stop at TWO\_PI… Why nothing happens is that the arc function starts and then immediately ends because the start and stop are at the same location… i.e. you’re telling it to start a 0 and then end at 0.

notice if you change 0 to something near zero such as 0.00000001 it will “work” but its technically not a closed circle