What does vx and vy denote in graphics?

Question

HI I'm making a small 2d game as my first project and I found this cool example online at https://ebiten.org/examples/sprites.html.

I'm just wondering what the meaning and purpose of vx, and vy is in the sprite structure (code snippet below). Thanks!

type Sprite struct {
    imageWidth  int
    imageHeight int
    x           int
    y           int
    vx          int
    vy          int
    angle       int
}

Answer 1

They're the X and Y velocity of the sprite. See this code in the Update() method:

    s.x += s.vx
    s.y += s.vy

Each time the sprite moves, its position is incremented by these two values.

Answer 2

vx and vy usually mean "velocity X" and "velocity Y." The velocity is used to move the player, by incramenting the player position by the velocity, like this:

player.posX += player.velX
player.posY += player.posY

However, this can be taken one step further, for more realistic movement, by creating an acceleration variable, like so: vel += acc and pos += vel.

Then, this can be used like this:

player.velX += player.accX
player.posX += player.velX

player.velY += player.accY
player.posY += player.velY

It works very similarly, but this allows the velocity to be slowly incremented, thus slowly incrementing the player position, which provides a neat and realistic acceleration effect.

Hope this helps!!