How to ensure point of interest remains centered during map scale

Hi all,

I’ve created an mc which functions as my map and controls to go with that which allow the map to be moved around and key points navigated to and zoomed in on at varying zoom levels.

I’m using scaleX and scaleY to scale the map mc and a list of x and y positions to correctly position the map for each key point. The map mc starts at 1:1 scale ratio with the screen and it’s registration point is at 0,0.

When I want to go to a certain area I perform this calculation (offsetX and offsetY are the center of the screen and posX and posY are predined offsets on the map):

newX = posX * scale + offsetX;
newY = posY * scale + offsetY;

Then I tween the position and scale of the map to smoothly scale and move the map to the correct position:

var tween = new TweenLite(_background, EASING_SPEED, {x:newX, y:newY,scaleX:scale.getScale(),scaleY:scale,ease:EASING_TYPE,onComplete:moveToComplete,onCompleteParams:[room]});

I now need to implement a zoom in / out function and this is what I’m struggling with. The zoom should use the center of the screen as the reg point for the scale, so I’ve been trying something along the lines of the following to get the correct x and y position to set after the scale:

var newX =  (_background.x * scale) + offsetX;

var newY = (_background.y * scale) + offsetY;

I know this is wrong but I’ve shown this to give you an idea of my train of thought, I need to work out what the new x and y will be to ensure that the area that is being zoomed in on, stays in the center of the screen.

So in my mind this gets the distance from the current position of the map relative to the center point of the screen (offsetX, offsetY) then scales that distance by the new scale.

However, this is clearly wrong because it’s not working and the positioning of the map is wrong.

If someone could shed some light on where I’m going wrong I’d be really grateful as I’ve a deadline for first thing monday!

Thanks in advance

eb_dev