# I just studied user defined function, got some trouble

**URL:** <https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405>\
**Category:** Coding Questions\
**Tags:** homework\
**Created:** [November 13, 2020, 11:09pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405 "2020-11-13T23:09:04Z")\
**Posts on this page:** 18\
**Page:** 1

<div class="post-metadata">

**Author:** ![mengtong](https://avatars.discourse-cdn.com/v4/letter/m/3ab097/32.png) [@mengtong](https://discourse.processing.org/u/mengtong)\
**Post date:** [November 13, 2020, 11:09pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/1 "2020-11-13T23:09:04Z")

</div>

I am trying to draw a picture like this. ![115截图20201113170735](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/7/779d59972872394293c2eff509c6eb267b70b4b5.png)  
here is my code. I just start it.

```auto
void setup() {
  size(800, 800);
  noStroke(); //No black outline around the circles
}

void draw() {
  final int CIRCLE_SIZE = 20;
  final int NUM_CIRCLES = 7;
  final float ANGLE = -PI/4;
  background(0);
  lineOfCircles(mouseX,mouseY,ANGLE,CIRCLE_SIZE,NUM_CIRCLES);
}

void lineOfCircles(float xStart, float yStart, float angle, float size, int numCirc){

}

void drawCircle(float x,float y, float d,float theta, float diam){
 for(int i=0;i<NUM_CIRCLES;i++){

   circle(x,y,diam);
}
}

float xAtAngle(float xFrom,float dist, float angle){
return xFrom+cos(angle)*dist;
}
float yAtAngle(float yFrom,float dist, float angle){
return yFrom+sin(angle)*dist;
}

```

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [November 13, 2020, 11:46pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/2 "2020-11-13T23:46:49Z")

</div>

Hi @mengtong

- First, you need to take the three final variables out of the draw() function and place them above setup() as global.
- Second, there is no code in the lineOfCircles(), so nothing will happen.
- Third, if you use drawCircle() in draw() instead the for() loop has no functionality, so thus only one sphere will appear.

---

<div class="post-metadata">

**Author:** ![mengtong](https://avatars.discourse-cdn.com/v4/letter/m/3ab097/32.png) [@mengtong](https://discourse.processing.org/u/mengtong)\
**Post date:** [November 14, 2020, 12:18am UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/3 "2020-11-14T00:18:21Z")

</div>

Sorry, I did not finish the code. I dont know how to write. And in this question, I can not move those constants, and also I cant create any global variables

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [November 14, 2020, 1:08am UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/4 "2020-11-14T01:08:48Z")

</div>

> [@mengtong](#):
>
> I can not move those constants

Why not? As they are final they will not change anymore. So you put them on the top of your sketch, where they are considered as global.

---

<div class="post-metadata">

**Author:** ![mengtong](https://avatars.discourse-cdn.com/v4/letter/m/3ab097/32.png) [@mengtong](https://discourse.processing.org/u/mengtong)\
**Post date:** [November 14, 2020, 2:05am UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/5 "2020-11-14T02:05:41Z")

</div>

This is a question from old exam, I am not allowed to use those constants in others function. They are local constants

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [November 14, 2020, 6:33am UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/6 "2020-11-14T06:33:01Z")

</div>

I just checked your earlier post, where you have these constants at the right place. You are trolling.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [November 14, 2020, 1:07pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/7 "2020-11-14T13:07:04Z")

</div>

> [@noel](#):
>
> First, you need to take the three final variables out of the draw() function and place them above setup() as global.

I don’t think this is necessary

> [@noel](#):
>
> You are trolling.

I don’t think that’s correct. I worked together with him very nicely.

```auto

//

void setup() {
  size(800, 800);
  noStroke(); //No black outline around the circles
}

void draw() {
  final int CIRCLE_SIZE = 20;
  final int NUM_CIRCLES = 7;
  final float ANGLE = -PI/4;

  // background(0);
  lineOfCircles(mouseX, mouseY, ANGLE, CIRCLE_SIZE, NUM_CIRCLES);
}

void lineOfCircles(float xStart, float yStart, float angle, float size, int numCirc) {
  for (int i=0; i<numCirc; i++) {

    float x1=xAtAngle(xStart+i*size, 13, angle);
    float y1=yAtAngle(yStart+i*size, 13, angle);

    ellipse(x1, y1, 
      size, size);
  }
}

//void drawCircle(float x, float y, float d, float theta, float diam) {
//}

float xAtAngle(float xFrom, float dist, float angle) {
  return xFrom+cos(angle)*dist;
}

float yAtAngle(float yFrom, float dist, float angle) {
  return yFrom+sin(angle)*dist;
}

```

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [November 14, 2020, 2:32pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/8 "2020-11-14T14:32:40Z")

</div>

> [@Chrisir](#):
>
> I don’t think that’s correct. I worked together with him very nicely.

Oh, then I apologize. But I don’t understand why one would put final variables in draw().

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [November 14, 2020, 4:18pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/9 "2020-11-14T16:18:42Z")

</div>

Just for me to get it correct I searched for code containing final variables in draw(); and I found a very nice code from @GoToLoop [here](https://forum.processing.org/two/discussion/2726/can-i-update-system-variables-in-the-middle-of-the-draw-function) at the bottom of the post. But I really think he used it there solely out of ease.  
In an article about “The Final Word On the final Keyword” [here](http://www.360doc.com/content/06/1007/20/8473_224657.shtml) it states:

 ![txt](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/6/6ffaf097fd7f4a9c342ce33f6c4b55ad36cd8f18.png)

---

<div class="post-metadata">

**Author:** ![mengtong](https://avatars.discourse-cdn.com/v4/letter/m/3ab097/32.png) [@mengtong](https://discourse.processing.org/u/mengtong)\
**Post date:** [November 14, 2020, 4:21pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/10 "2020-11-14T16:21:52Z")

</div>

Because I am a student, and this is a question from my instructor, she said that I can not change those constants. I just learned a new thing which called user defined function. My instructor just want us to practice the new thing.

---

<div class="post-metadata">

**Author:** ![mengtong](https://avatars.discourse-cdn.com/v4/letter/m/3ab097/32.png) [@mengtong](https://discourse.processing.org/u/mengtong)\
**Post date:** [November 14, 2020, 4:26pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/11 "2020-11-14T16:26:34Z")

</div>

But, I know you are right. it’s just that in this case, we are not allowed to do that

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [November 14, 2020, 4:54pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/12 "2020-11-14T16:54:27Z")

</div>

> [@noel](#):
>
> In an article about “The Final Word On the final Keyword” [here](http://www.360doc.com/content/06/1007/20/8473_224657.shtml) it states:

I’ve got an old example on the previous forum where the anonymous instantiated `class` TimerTask access the `final` parameter _sec_ from the function **createScheduleTimer()**: 🤓

- [millis() and timer - Processing 2.x and 3.x Forum](http://Forum.Processing.org/two/discussion/1725/millis-and-timer#Item_7)

Such local variables/parameters are known as closures in the JS world & are rare to find in Java: ☕

> **[Closures - JavaScript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures)**
>
> A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function's scope from an inner function. In JavaScript,...

---

<div class="post-metadata">

**Author:** ![mengtong](https://avatars.discourse-cdn.com/v4/letter/m/3ab097/32.png) [@mengtong](https://discourse.processing.org/u/mengtong)\
**Post date:** [November 14, 2020, 6:04pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/13 "2020-11-14T18:04:11Z")

</div>

Thanks for your help. I have modified a little code, but the result is not the same as what I want ![115截图20201114115942](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/3/3f4b7a6a39d8e0b420432cf350b67ef391f54a6d.png)

```auto
void setup() {
  size(800, 800);
  noStroke(); //No black outline around the circles
}

void draw() {
  final int CIRCLE_SIZE = 20;
  final int NUM_CIRCLES = 7;
  final float ANGLE = -PI/4;

   background(0);
  lineOfCircles(mouseX, mouseY, ANGLE, CIRCLE_SIZE, NUM_CIRCLES);
}

void lineOfCircles(float xStart, float yStart, float angle, float size, int numCirc) {
  for (int i=0; i<numCirc; i++) {

    float x1=xAtAngle(xStart+i*size, 13, angle);
    float y1=yAtAngle(yStart-i*size, 13, angle);
    ellipse(x1, y1, size, size);
  }
}

//void drawCircle(float x, float y, float d, float theta, float diam) {
//}

float xAtAngle(float xFrom, float dist, float angle) {
  return xFrom+cos(angle)*dist;
}

float yAtAngle(float yFrom, float dist, float angle) {
  return yFrom+sin(angle)*dist;
}

```

In your code, the first circle’s center should stay with mouse’s center. I should set 13 to 0, then the first circle’s center gonna stay with mouse’s center. But I dont think it is correct. Also if I want to use another function which call void drawCircle, you commented it. How can I use it? I mean I will draw all the circles in void drawCircle function, and call this function from void lineOfCircles function.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [November 14, 2020, 9:59pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/14 "2020-11-14T21:59:57Z")

</div>

I guess you need to move the code from inside the for loop into drawCircle function and then call this function from inside the for loop please

You can replace the 13 with `13*i`

---

<div class="post-metadata">

**Author:** ![mengtong](https://avatars.discourse-cdn.com/v4/letter/m/3ab097/32.png) [@mengtong](https://discourse.processing.org/u/mengtong)\
**Post date:** [November 14, 2020, 10:05pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/15 "2020-11-14T22:05:14Z")

</div>

Why is there a distance in the middle of each circle? I don’t understand why.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [November 14, 2020, 10:07pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/16 "2020-11-14T22:07:50Z")

</div>

Maybe replace 13 with circle\_size

---

<div class="post-metadata">

**Author:** ![mengtong](https://avatars.discourse-cdn.com/v4/letter/m/3ab097/32.png) [@mengtong](https://discourse.processing.org/u/mengtong)\
**Post date:** [November 14, 2020, 10:57pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/17 "2020-11-14T22:57:03Z")

</div>

This is a copy of my question, I dont know where the float d comes from.

 ![115截图20201114165427](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/e/e05ac40209059302c82b77e7298a91fd7ef64e21.png)

```auto
void setup() {
  size(800, 800);
  noStroke(); //No black outline around the circles
}

void draw() {
  final int CIRCLE_SIZE = 20;
  final int NUM_CIRCLES = 7;
  final float ANGLE = -PI/4;
  background(0);
  lineOfCircles(mouseX, mouseY, ANGLE, CIRCLE_SIZE, NUM_CIRCLES);
}

void lineOfCircles(float xStart, float yStart, float angle, float size, int numCirc) {
  for (int i=0; i<numCirc; i++) {
    float nextX=xStart+i*cos(angle)*size;
    float nextY= yStart+i*sin(angle)*size;
    circle(nextX, nextY, size);
  }
} 

```

I use another way to do this question is very easy. But in this way, I feel confused.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [November 15, 2020, 7:59pm UTC](https://discourse.processing.org/t/i-just-studied-user-defined-function-got-some-trouble/25405/18 "2020-11-15T19:59:06Z")

</div>

> [@mengtong](#):
>
> where the float d comes from.

d is just the distance of the circle from point x,y