Zooming in Flex.AS3

programming flash
1

Hi all,

I was wondeirng if anyone had any good examples of zooming in Flex/AS3? I currently have a function which does mouse scroll zooming similar to google maps! For this i have a scale at function

[SIZE=2][SIZE=2][COLOR=#0033ff][LEFT]public[/COLOR][/SIZE][SIZE=2] [/SIZE][SIZE=2][COLOR=#339966]function[/COLOR][/SIZE][SIZE=2] scaleAt( scale : Number, originX : Number, originY : Number) : [/SIZE]**[SIZE=2][COLOR=#0033ff]void[/LEFT]
**[/COLOR][/SIZE][SIZE=2][LEFT]{
affineTransform = transform.matrix;
affineTransform.translate( -originX, -originY );
affineTransform.scale( scale, scale );
affineTransform.translate( originX, originY );
transform.matrix = affineTransform;[/LEFT]
}

and then I create some functions to use as mouseEvents

[SIZE=2][COLOR=#0033ff][LEFT]private[/COLOR][/SIZE][SIZE=2] [/SIZE][SIZE=2][COLOR=#339966]function[/COLOR][/SIZE][SIZE=2] onMouseWheel( event : MouseEvent ) : [/SIZE][SIZE=2][COLOR=#0033ff]void[/LEFT]
[/COLOR][/SIZE][SIZE=2][LEFT]{
[/SIZE][SIZE=2][COLOR=#6699cc] var[/COLOR][/SIZE][SIZE=2] originX : Number = stage.mouseX;
[/SIZE][SIZE=2][COLOR=#6699cc] var[/COLOR][/SIZE][SIZE=2] originY : Number = stage.mouseY;

[/SIZE][SIZE=2][COLOR=#0033ff] if[/COLOR][/SIZE]SIZE=2
{
[/SIZE][SIZE=2][COLOR=#0033ff] if[/COLOR][/SIZE][SIZE=2]( event.delta > 0 )
{
scaleAt(6/5, originX, originY );
}
[/SIZE]**[SIZE=2][COLOR=#0033ff] else[/LEFT]
**[/COLOR][/SIZE][SIZE=2][LEFT] {
scaleAt(5/6, originX, originY );
}
}
}

[/SIZE][SIZE=2][COLOR=#0033ff]private[/COLOR][/SIZE][SIZE=2] [/SIZE][SIZE=2][COLOR=#339966]function[/COLOR][/SIZE][SIZE=2] onMouseDown( event : MouseEvent ) : [/SIZE]**[SIZE=2][COLOR=#0033ff]void[/LEFT]
**[/COLOR][/SIZE][SIZE=2][LEFT]{
startDrag();
}

[/SIZE][SIZE=2][COLOR=#0033ff]private[/COLOR][/SIZE][SIZE=2] [/SIZE][SIZE=2][COLOR=#339966]function[/COLOR][/SIZE][SIZE=2] onMouseUp( event : MouseEvent ) : [/SIZE]**[SIZE=2][COLOR=#0033ff]void[/LEFT]
**[/COLOR][/SIZE][SIZE=2][LEFT]{
stopDrag();[/LEFT]
}

This looks nice but I can’t seem to limit the Zoom! I’m using a viewstate to toggle between a grid view and a chart view! I want to be able to zoom in and out of the viewstate but I only want the grid and chart to be zoomable! That is I want the buttons and the rest of the viewstate to remain the same but the user’ll be able to zoom into the chart or gridview? Does anyone know how I can limit the view to the actual components in the viewstate? I tried just butting zoom on the chart but although I had no zoom ability on the grid if I zoomed in or out of the chart and changed viewstate, the grid would also be zommed in or out?

I was also wondering if anyone has any other zooming examples? Maybe been able to select an area to zoom in on, something like that?! I’ve tried the Flex zoom tag but haven’t really been able to create the a nice zoom in and out effect, other than zomming in once and zoomin out once??

Any help would be greatly appreciated
Thanks,
Dermot
[/SIZE][/SIZE][/SIZE]