Page 1 of 1

Math: Circular Movement

Posted: Wed Jan 11, 2012 12:59 pm
by Fl0x
As I found nothing in search, neither in the wiki, I'll post it here.
Well, I am trying to make a background, where 18 circles with the radius of 80 are moving on the same circular path with the same distance.

Pretty much all I got is

Code: Select all

for i=1,18 do
love.graphics.circle("fill",cos(rotation*i)*300,sin(rotation*i)*300,80,80*3)
end
While rotation is the angle, which is increased in love.draw by 0.001.

I don't seem to find a way that the distance between them and the speed is the same, though I tried several things.

Re: Math: Circular Movement

Posted: Wed Jan 11, 2012 1:21 pm
by ivan
cos and sin work with radians.
In order to keep the distance between the 18 circles equal you would have to do something like:

Code: Select all

for i = 1, 18 do
  local angle = i/18 * math.pi + rotation
  local x, y = math.cos(angle), math.sin(angle)
  -- draw circle at x*radius, y*radius
end
'radius' is the distance between the 18 circles and the pivot
'rotation' would work like an 'offset' value and it's probably a good idea to clamp it between 0 and math.pi:

Code: Select all

-- update the rotation offset each frame
rotation = rotation + 0.001*dt
rotation = rotation%math.pi

Re: Math: Circular Movement

Posted: Wed Jan 11, 2012 1:37 pm
by middlerun
Wouldn't you want to clamp it between 0 and 2*Pi? 2*Pi being one full rotation. And for the same reason you'd want the offset to be

Code: Select all

i/18 * 2 * math.pi
or simply

Code: Select all

i/9 * math.pi
Here's something I wrote before I saw Ivan's reply. I didn't bother clamping it.

Code: Select all

function love.load()		
  rotation = 0
end

function love.update(dt)
  rotation = rotation + 0.1 * dt
end

function love.draw()
  for i=1,18 do
    love.graphics.circle("fill", love.graphics.getWidth()/2 + math.cos(rotation + i * math.pi/9) * 300, love.graphics.getHeight()/2 + math.sin(rotation + i * math.pi/9) * 300, 80, 80*3)
  end
end

Re: Math: Circular Movement

Posted: Wed Jan 11, 2012 1:43 pm
by Robin
You don't need any clamping: just like 365° is the same as 5°, is math.pi * 2 + 1 radian the same as 1 radian.

Re: Math: Circular Movement

Posted: Wed Jan 11, 2012 9:14 pm
by Jasoco
Maybe I'm misunderstanding but what about this?

Code: Select all

--In your LOAD function
dist = 300
count = 18
rad = 80
center_x, center_y = 400, 300
spin = 0
spinspeed = 100

--In you UPDATE function
spin = spin + spinspeed * dt

--In your DRAW function
for i = 0, count - 1 do
  local angle = i * (math.pi * 2 / count) + math.rad(spin)
  local x = center_x + math.cos(angle) * dist
  local y = center_y + math.sin(angle) * dist
  love.graphics.circle("fill", x, y, rad)
end
Play around with the variables and see what you can do.