[TransformAroundPoint - Keeping track of scale [SOLVED]]

figured it out.

 

I had different values for scaling/zooming in/out

 

it was:

//in
var scaleInt:Number = 10 / 9;
//out
var scaleInt:Number = 9  / 10;

 

and should be:

//in
var scaleInt:Number = 10 / 9;
//out
var scaleInt:Number = 10  / 9;

 

And now it works like a charm Thanks again for this plugin!

[TransformAroundPoint - Keeping track of scale [SOLVED]]

Hi,

 

Im using the transformAroundPoint plugin with great succes! The only issue I have now is how to keep track of the scaled objects scaleX/scaleY values!

 

I want to be able to toggle the scale/zoom effect on/off depending on how close or far the objects has been scaled. My code looks like this:

public function onMouseWheel( event : MouseEvent ) : void
	{			
		// to the current position of the mouse
		var originX : Number = stage.mouseX
		var originY : Number = stage.mouseY

		// zoom
		if( !event.altKey )
		{
			//_frameholder is the object container to be scaled
			//in my previous attempt to scale (without the tween plugin) i had no issues with using the scale property,
			//but now in my traces the scale value is different and not reliable (meaning that it varies too much(??)).
			if( event.delta > 0 && _frameHolder.scaleX < 2)
			{	
				if (!stage.hasEventListener(Event.ENTER_FRAME))
				{
					//the enterframe enables a mousepanning effect so the user can move around "the map" by moving the mouse
					stage.addEventListener(Event.ENTER_FRAME, enterFrameHandler);
				}else
				{
					trace("enterframe in progress");
				}
				// zoom in
				var scaleInt:Number = 10 / 9;
				TweenLite.to(_frameHolder, .5, { transformAroundPoint: { point:new Point(originX, originY), scale:String(scaleInt) }} );
			}
			else if ( event.delta < 0 && _frameHolder.scaleX > 1)
			{
				// zoom out					
				var scaleInt:Number = 9 / 10;
				TweenLite.to(_frameHolder, .5, { transformAroundPoint: { point:new Point(originX, originY), scale:String( -scaleInt) }} );
			}
			else if ( _frameHolder.scaleX <= 1 )
			{
				if (stage.hasEventListener(Event.ENTER_FRAME))
				{
					stage.removeEventListener(Event.ENTER_FRAME, enterFrameHandler);
				} else
				{
					trace("enterframe already gone");
				}
			}
		}			
	}

 

An example can be seen here http://www.steffensonderby.dk/messe/messe.html Scroll up and down with mouse to zoom or use arrow key up/down.

 

Any reply appreciated.

 

Cheers

[Issue with transform.matrix and TweenMax]

Hi and thanks for the reply.

 

I was convinced that the other one was the one for me, but i'll def have a look at the transformAroundPoint! Looks very nice!

 

Cheers

[Issue with transform.matrix and TweenMax]

Hi all,

 

I've been working on a zoom effect to a map in my project. I got it from a file originally published on http://gasi.ch/blog/2008/02/05/zooming-in-flash-flex/

Its been working like a charm, but now when i try to add a TweenMax, im finding it very difficult to implement it right.

 

My original zoom code:

public function scaleAt( scale : Number, originX : Number, originY : Number ) : void
{
	// get the transformation matrix of this object
	affineTransform = _myObject.transform.matrix
	affineTransform.translate( -originX, -originY )
	// move the object to (0/0) relative to the origin
	affineTransform.translate( -originX, -originY )
	// scale
	affineTransform.scale( scale, scale )
	// move the object back to its original position
	affineTransform.translate( originX, originY )
	// apply the new transformation to the object
	_myObject.transform.matrix = affineTransform			
	}
	// Event Handlers
	public function onMouseWheel( event : MouseEvent ) : void
	{
		// set the origin of the transformation
		// to the current position of the mouse
		var originX : Number = stage.mouseX
		var originY : Number = stage.mouseY

		// zoom
		if( !event.altKey )
		{
			if( event.delta > 0 )
			{					
				// zoom in
				scaleAt( 9/8, originX, originY ) 
			}
			else
			{
				// zoom out					
				scaleAt( 8/9, originX, originY )
			}
		}

	}

This works fine, except it needs a tween. Now when i try to do this:

affineTransform = _messeHolder.transform.matrix
affineTransform.translate( -originX, -originY )

TweenMax.to(affineTransform, 1, { onUpdate:applyMatrix, onUpdateParams:[_myObject, affineTransform]});
		function applyMatrix($clip:Sprite, $matrix:Matrix):void {
			$matrix.a *= scale;
			$matrix.d *= scale;
			$matrix.tx *= scale;
			$matrix.ty *= scale;
			$matrix.tx += originX;
			$matrix.ty += originY;

			$clip.transform.matrix = $matrix;
		}	

It reacts very wrong. I've played around with the values, and tried to place all the values in the TweenMax.To line, but without luck. Im guessing the problem has something to do with the matrix calculating the mouse properties?

 

Thanks in advance! Any help appreciated!! Ive been sitting with this way too long

 

Cheers

Steffen