How would you update the state of a 2D object that is thrown forward(with an arc) facing a target to simulate a 3D(depth) like effect?

var ball; //2D ball from a sprite sheet
ball.x = 0;
ball.y = 0;
ball.scaleX = 1;
ball.scaleY = 1;

ball.throw(); //set ball to a throwing state
ball.update(); //update the ball's positon and depth by calculating its current coordinates and scale.   

1 Answer 1


i think you should add a z property to your ball, and then update scaleX and scaleY accordingly :


ball.vx = 0.0f; //no move horizontally
ball.vy = 3.0f; //to have arc effect
ball.vz = 5.0f; //throw forward


//move the ball
ball.x += ball.vx;
ball.y += ball.vy;
ball.z += ball.vz;

ball.vy -= 0.097f;

//add code here to check collision against floor and bounce

//some friction
ball.vx *= 0.99f;
ball.vy *= 0.99f;
ball.vz *= 0.99f;


//very simple formula, assume camera is origin

float x = ball.x / ball.z;
float y = ball.y / ball.z;

float scaleX = ball.scaleX / ball.z;
float scaleY = ball.scaleY / ball.z;

draw ball at pos (x,y) , using scaleX and scaleY

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .