LÖVE

Posted: **Thu Jun 02, 2022 3:16 pm**

Hello,

I drew an image and rotated it by increasing its rotation by 1 degree converted in radians every second, or at least that's what I think I am doing feel free to correct me on that if I am wrong

Here's my code for that so that you can see better :

Code: Select all

local data = {}

function love.load()
  data.sprite = love.graphics.newImage("Lizard.png")

  data.width = data.sprite:getWidth()
  data.height = data.sprite:getHeight()
  data.x = love.graphics.getWidth() / 2 - data.width / 2
  data.y = love.graphics.getHeight() / 2 - data.height / 2
  data.rotation = math.rad(0)
  data.scaleX = 1
  data.scaleY = 1
  data.originX = data.x + data.width / 2
  data.originY = data.y + data.height / 2
end

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

function love.draw()
  love.graphics.setColor(1, 1, 1)
  love.graphics.draw(data.sprite, data.x, data.y, data.rotation, data.scaleX, data.scaleY, data.originX, data.originY)

  -- Rectangle Hitbox
  love.graphics.rectangle('line', data.x, data.y, data.width, data.height)

  -- Center
  love.graphics.circle('fill', data.x + data.width / 2, data.y + data.height / 2, 4)
end

So with that the image rotates around its top-left corner (it goes off the screen when over, under and to the left of its original position however does not go that far when to the right, stays visible), even though I drew it with with its x and y origins being at its center.
Also it rotates far from it, like I drew the rectangular hitbox and a small circle at the center and it is shwown and rotates at a distance way outside of it, and I don't know why

Posted: **Fri Jun 03, 2022 12:11 am**

The origin is in image space, not screen space, and determines what position in the image should render at the specified xy coordinates. The default origin is (0, 0) which refers to the top left corner of the image - you want the origin to be the center of the image, i.e. (data.width/2, data.height/2). Change originX=data.x+data.width/2 to just originX=data.width/2, and same with originY, to draw the image centered at the specified xy coordinates.

Posted: **Fri Jun 03, 2022 12:16 am**

edit: oops, ReFreezed had everything covered

Posted: **Fri Jun 03, 2022 7:08 am**

pgimeno wrote: ↑Fri Jun 03, 2022 12:16 am edit: oops, ReFreezed had everything covered

Please keep the explanation, two explanations is 20% better than just one

Posted: **Fri Jun 03, 2022 9:28 am**

What I said is that the position is where you place the origin, not where you place the top left corner, so in addition to that change you also need this one:

Code: Select all

-- Change this:
  data.x = love.graphics.getWidth() / 2 - data.width / 2
  data.y = love.graphics.getHeight() / 2 - data.height / 2
-- to this:
  data.x = love.graphics.getWidth() / 2
  data.y = love.graphics.getHeight() / 2

Posted: **Mon Jun 20, 2022 4:20 pm**

hello pgimeno,
only left corner??

LÖVE

Rotating an image on its center

Rotating an image on its center

Re: Rotating an image on its center

Re: Rotating an image on its center

Re: Rotating an image on its center

Re: Rotating an image on its center

Re: Rotating an image on its center