Question

I have an Image that’s 5000 pixels by 5000 pixels. It’s scaled up and down regularly to fit different parts of the image into the window.

I’m making a function that focuses in on different places on the image (like a map) and then zooms into a certain scale that I specify.

I pass my point into this function (new Point(2000,2500) for example)) however this always breaks because it’s not relative to the image specifically.

How do I make the Point relative to the image at the image’s given scale at any given time?

Additional Info: I’m using the guide here http://www.adobe.com/devnet/flex/samples/fig_panzoom.html for panning and zooming functionality.

Solved:

One of my pitfalls was that I was using a possible bitmapScaleFactor > 1 which would mess up the scaling. This was the final function that worked for my usage.

protected function testFocus(p:Point):void
        {
            var content:ContentRectangle = boardViewer._contentRectangle;
            var panToPoint:PanToPointCommand = new PanToPointCommand(boardViewer, content);
            var scale:Number = boardViewer.bitmapScaleFactor;

            var location = new Point((p.x*scale)+content.x, (p.y*scale)+content.y);             
            var center = new Point(boardViewer.width/2, boardViewer.height/2);

            //Move the point to the center
            panToPoint.fromPoint = location;
            panToPoint.toPoint = center;
            panToPoint.execute();
        }

Answer 1

I’ve not tested this but how about using the scale factor that is being applied to the image to alter the point coordinates.

e.g.

var scaler:Number = 0.5;

image.scaleX = image.scaleY = scaler;

new Point(2000*scaler,2500*scaler);