Help me displaying my vector pls x_x

General discussion about LÖVE, Lua, game development, puns, and unicorns.
Post Reply
User avatar
Marcus Aseth
Prole
Posts: 14
Joined: Wed Apr 05, 2017 11:56 am

Help me displaying my vector pls x_x

Post by Marcus Aseth »

Code and image below.
Basically I'm trying to diplay an arrow (pointing in the direction the ball is traveling) at the end of the yellow movement vector, I'm almost there but as you can see, one of the 2 "pointy-lines" of the arrow is pointing 270° instead of 90°.
If I negate the Y for that "pointy-line"in the code, it solve that particular case but as soon as the ball bounce the wall, the resoult is mirrored again, so I think it has to do with the circle's quadrants or something.
How do you guys achieve this the smart way? :P

Code: Select all

local function showDirection(entity, lineLenght)
  --find center pivot
  local lineStartX = entity.x + entity.width / 2
  local lineStartY = entity.y + entity.height / 2
  --find length of vector
  local lineEndX = lineStartX + entity.direction.x * entity.speed * lineLenght
  local lineEndY = lineStartY + entity.direction.y * entity.speed * lineLenght

  --main line
  love.graphics.setColor(235, 235, 0, 255)
  love.graphics.line(lineStartX, lineStartY, lineEndX, lineEndY)

  --degAngle is the angle of the movement vector range 0°-360°
  local degAngle = helpers.findDegAngle({ x = lineStartX, y = lineStartY }, { x = lineEndX, y = lineEndY })
  --arrow line 1
  local Radius = math.sqrt(math.pow(lineEndX - lineStartX, 2) + math.pow(lineEndY - lineStartY, 2)) / 3
  local arrow1Angle = (degAngle + 135) % 360
  local line1X = lineEndX + Radius * math.cos(math.rad(arrow1Angle))
  local line1Y = lineEndY + Radius * math.sin(math.rad(arrow1Angle))
  love.graphics.line(lineEndX, lineEndY, line1X, line1Y)

  --arrow line 2
  local arrow2Angle = (degAngle + 225) % 360
  local line2X = lineEndX + Radius * math.cos(math.rad(arrow2Angle))
  local line2Y = lineEndY + Radius * math.sin(math.rad(arrow2Angle))
  love.graphics.line(lineEndX, lineEndY, line2X, line2Y)
end
Image
User avatar
Ref
Party member
Posts: 702
Joined: Wed May 02, 2012 11:05 pm

Re: Help me displaying my vector pls x_x

Post by Ref »

Something like this?
Attachments
arrow.love
Some related functions
(745 Bytes) Downloaded 161 times
User avatar
Marcus Aseth
Prole
Posts: 14
Joined: Wed Apr 05, 2017 11:56 am

Re: Help me displaying my vector pls x_x

Post by Marcus Aseth »

So atan2 is the answer, I had though of trying that since in the lua documentation about it it says " but uses the signs of both parameters to find the quadrant of the result. (It also handles correctly the case of x being zero.)" Though I was trying to avoid it since I get confused when handling radians.
Oh well, I'll try that way then, thanks :awesome:
User avatar
Marcus Aseth
Prole
Posts: 14
Joined: Wed Apr 05, 2017 11:56 am

Re: Help me displaying my vector pls x_x

Post by Marcus Aseth »

here it is, works beatifully, thanks again :3 (though I still don't really like working with radians, I guess I need to understand them better in order to like them)
Breaker.love
(9.96 KiB) Downloaded 169 times
now my code looks like

Code: Select all

local function showDirection(entity, lineLenght)
  --find center pivot
  local lineStartX = entity.x + entity.width / 2
  local lineStartY = entity.y + entity.height / 2
  --find length of vector
  local lineEndX = lineStartX + entity.direction.x * entity.speed * lineLenght
  local lineEndY = lineStartY + entity.direction.y * entity.speed * lineLenght

  --main line
  love.graphics.setColor(235, 235, 0, 255)
  love.graphics.line(lineStartX, lineStartY, lineEndX, lineEndY)

  local radAngle = math.atan2((lineEndX - lineStartX), (lineEndY - lineStartY))
  --arrow line 1
  local Radius = math.sqrt(math.pow(lineEndX - lineStartX, 2) + math.pow(lineEndY - lineStartY, 2)) / 3
  local arrow1Angle = ( -0.25 * math.pi  - radAngle )
  local line1X = lineEndX + Radius * math.cos(arrow1Angle)
  local line1Y = lineEndY + Radius * math.sin(arrow1Angle)
  love.graphics.line(lineEndX, lineEndY, line1X, line1Y)

  --arrow line 2
  local arrow2Angle = (-0.75 * math.pi  - radAngle)
  local line2X = lineEndX + Radius * math.cos(arrow2Angle)
  local line2Y = lineEndY + Radius * math.sin(arrow2Angle)
  love.graphics.line(lineEndX, lineEndY, line2X, line2Y)
end
Can you guys give me further insight regarding the line "local arrow1Angle = ( -0.25 * math.pi - radAngle )", why it is changing the angle the way it is or just suggest me some me some way for me to think about radians that can help me make better sense of them? :P
Or any online resource that helped you in the past, whatever works, I just want to get hold of them :awesome:
User avatar
s-ol
Party member
Posts: 1077
Joined: Mon Sep 15, 2014 7:41 pm
Location: Cologne, Germany
Contact:

Re: Help me displaying my vector pls x_x

Post by s-ol »

Marcus Aseth wrote: Sat Apr 15, 2017 11:09 pm here it is, works beatifully, thanks again :3 (though I still don't really like working with radians, I guess I need to understand them better in order to like them)

Breaker.love

now my code looks like

Code: Select all

local function showDirection(entity, lineLenght)
  --find center pivot
  local lineStartX = entity.x + entity.width / 2
  local lineStartY = entity.y + entity.height / 2
  --find length of vector
  local lineEndX = lineStartX + entity.direction.x * entity.speed * lineLenght
  local lineEndY = lineStartY + entity.direction.y * entity.speed * lineLenght

  --main line
  love.graphics.setColor(235, 235, 0, 255)
  love.graphics.line(lineStartX, lineStartY, lineEndX, lineEndY)

  local radAngle = math.atan2((lineEndX - lineStartX), (lineEndY - lineStartY))
  --arrow line 1
  local Radius = math.sqrt(math.pow(lineEndX - lineStartX, 2) + math.pow(lineEndY - lineStartY, 2)) / 3
  local arrow1Angle = ( -0.25 * math.pi  - radAngle )
  local line1X = lineEndX + Radius * math.cos(arrow1Angle)
  local line1Y = lineEndY + Radius * math.sin(arrow1Angle)
  love.graphics.line(lineEndX, lineEndY, line1X, line1Y)

  --arrow line 2
  local arrow2Angle = (-0.75 * math.pi  - radAngle)
  local line2X = lineEndX + Radius * math.cos(arrow2Angle)
  local line2Y = lineEndY + Radius * math.sin(arrow2Angle)
  love.graphics.line(lineEndX, lineEndY, line2X, line2Y)
end
Can you guys give me further insight regarding the line "local arrow1Angle = ( -0.25 * math.pi - radAngle )", why it is changing the angle the way it is or just suggest me some me some way for me to think about radians that can help me make better sense of them? :P
Or any online resource that helped you in the past, whatever works, I just want to get hold of them :awesome:
radians aren't very complicated, it's just that instead of defining a full circle as '360 degrees' you define it as 'two times pi'.
So
full rotation = 2 * pi
half rotation = pi
right angle = pi / 2

and so you can see that

(-0.75 * math.pi) = -3/4 * math.pi = - 3/8 * (math.pi * 2)

means 'three eights of a full rotation', counterclockwise, since positive angles in love2d rotate clockwise, and this one is negative.
The reason that 2 pi are the number chosen for radians is that when you have an arc that spans N radians with a radius R, then the length of that arc is R * N (as opposed to alpha/180° * math.pi * R, which - big surprise - is the same as doing the calculation in radians in the first place).

s-ol.nu /blog  -  p.s-ol.be /st8.lua  -  g.s-ol.be /gtglg /curcur

Code: Select all

print( type(love) )
if false then
  baby:hurt(me)
end
User avatar
Marcus Aseth
Prole
Posts: 14
Joined: Wed Apr 05, 2017 11:56 am

Re: Help me displaying my vector pls x_x

Post by Marcus Aseth »

Thanks for the explanation s-ol, I think that another reason I was a bit confused about it was that (unless I did something horribly wrong) the circle seems rotated 90° counter-clockwise compared to the image of it I see on google, meaning pi/2 is on the left :?

Edit: maybe is that multiplying by -0.75 and -0.25 is mirroring it? :shock:
Post Reply

Who is online

Users browsing this forum: No registered users and 59 guests