Hello,

I am looking to start a programming project.
But stuck at the first
I want to program a progressive circle that follows a line.

I will add a picture because im unsure how to explain.

Hello @rbu,

There are resources here to start you on your journey:

``````float x = cos(radians(angle)) * radius;
point(x, y); // hint...
``````

You will have to consider how to increase angle over timeâ€¦

Start simple and draw a circle with pointsâ€¦

Once you have an x and y point of a circle to plot you can then add to the y over time and have the circles progress in the y direction.

Start simple and work from thereâ€¦

I did this in a few lines of code with above suggestion:

You may want try drawing a line at first and have it grow longer over time.

``````float x;
float y;

void setup()
{
size(300, 600);
}

void draw()
{
x = 150;
point(x, y);
y = y+1;
}
``````

If you are a beginner you need to look up the references for every element of your code:

• setup()
• draw()
• background()
• size()
• point()
• And so onâ€¦

`:)`

2 Likes

Hi @Rbu,

Just as another hintâ€¦

This from @glv post â€¦

``````float x = cos(radians(angle)) * radius;
point(x, y); // hint...
``````

â€¦ will give you the circle points around the origin (0,0).
If you want to adjust the origin you need to apply an offset for x and y.
Ie:

``````// offX could be x value of your line point
// offY could be y value of your line point
point(x, y); // hint...
``````

Cheers
â€” mnse

1 Like

Itâ€™s also fun to do in 3D

Like a spiral going north

Thanks for the help.

Iâ€™m struggling, to be honest. If there is a level zero with coding, Iâ€™m minus 1. I have read the references and understand the basics.

I also understand the simple example where the line progresses, but I can not work out how to even draw the circle with the cos and sin for the life of me.

1 Like

This would work inside a for loop from angle going from 0
To 360

``````for(int angle=0; angle<360; angle++) {

...

}
``````

A few variables are to be defined before the for loop:

`float radius=30; float offX=90; float offY=90;`

There are examples available with the Processing IDE (File > Examplesâ€¦ ):

Take a look at the one I highlighted.

Consider going through some of the tutorials on the Processing website:

`:)`

One more hint.
You may also require strokeWeight() function.

So I think I have done it.

``````float radius = 50;
float offX = 300;
float offY = 25;

void setup()  {
size(600,600);
}

void draw()  {

for(int angle=0; angle<360; angle++) {
point(x,y);
offY += 0.15;
}

}
``````

so my next objective is to go from pixel a say 150,150 to pixel 300,300. got any hints pls

Hello,

Try drawing a line with `point()` and also with `line()` from (150, 150) to (300, 300).

Look up the references for:

• `point()`
• `line()`
• `for()`

Are you using the resources here?

Another good resource:

`:)`

hello glv,

i get the line but where am I going wrong with the point?

``````float radius = 50;
float offX = 300;
float offY = 25;

void setup()  {
size(750,750);
line(150,150,600,150);
line(150,150,150,600);
line(600,150,600,600);
line(150,600,600,600);
}

void draw()  {

for(int k = 600; k < 150; k = k-11){
for(int j = 600; j < 150; j = j-1){
point(k,j);

}
}

for(int i = 150; i < 600; i = i+1){
line(150,150,i,i);
}

for(int angle=0; angle<360; angle++) {
point(x1,y1);
offY += 0.15;
}

}
``````

For the line you donâ€™t need a
for loop.

line(offX, offY, offX, offY +
height- 100);

or so

Hello,

You are trying to progress from a -1 skill level to a nested for loop that is decrementing.

Start simple and work from there.

Try an incrementing for loop first.

Read a bit more about for loops and take a close look at this test in your loop:

`k < 150 // this evaluates to false`

These are popular tutorials:

`:)`