# throw a 2D ball facing the target to simulate a 3D like effect

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.
ball.render();


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

throw()

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


update()

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

//gravity
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;


render()

//projection
//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