Bar Plot Animation

445 views
Skip to first unread message

Javid

unread,
Jun 15, 2011, 11:36:41 AM6/15/11
to coreplot-discuss
Hi,
I am sure this question has been asked in this forum several times.
But searching through this forum, I couldn't find any good examples.
I want to achieve an animation on a bar chart where it appears as the
bar grows vertically.
I tried using the CABasicAnimation with transform as key path, but I
get the following error:
<Error>: CGAffineTransformInvert: singular matrix

Here is my example code:

barPlot.transform = CATransform3DMakeScale(0.0, 0.0, 1.0);

CABasicAnimation *scaling = [CABasicAnimation
animationWithKeyPath:@"transform"];
CATransform3D transform = CATransform3DMakeScale(1.0, 1.0, 1.0);
scaling.removedOnCompletion = NO;
scaling.fillMode = kCAFillModeForwards;
scaling.toValue = [NSValue valueWithCATransform3D:transform];
scaling.duration = 5.0f;
[graph addAnimation:scaling forKey:@"scaling"];

I am pretty sure the error is because of me setting 0.0, the initial
barPlot transform.

Should I be using the frame CGRect bounds to achieve what I am trying
to do?
Any code samples would be very helpful.

Thanks,
Javid

Drew McCormack

unread,
Jun 15, 2011, 11:40:54 AM6/15/11
to coreplot...@googlegroups.com
I haven't tried this, but one problem I see is that your scaling is wrong. Try starting with a scaling of (1.0, 0.01, 1.0).
Another way to animate it would be to use a translation transform.

Drew

> --
> You received this message because you are subscribed to the Google Groups "coreplot-discuss" group.
> To post to this group, send email to coreplot...@googlegroups.com.
> To unsubscribe from this group, send email to coreplot-discu...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/coreplot-discuss?hl=en.
>

Javid

unread,
Jun 15, 2011, 3:04:54 PM6/15/11
to coreplot-discuss
Hi Drew,
The scaling with 0.01 didn't work. The only time the scaling animation
seems to work is if I set the scale transform to a higher value than
1.0 in my CABasicAnimation block.
For example the code below doesnt work

barPlot.transform = CATransform3DMakeScale(1.0, 0.1, 1.0);

CABasicAnimation *scaling = [CABasicAnimation
animationWithKeyPath:@"transform"];
CATransform3D transform = CATransform3DMakeScale(1.0, 1.0, 1.0);
scaling.removedOnCompletion = NO;
scaling.fillMode = kCAFillModeForwards;
scaling.toValue = [NSValue valueWithCATransform3D:transform];
scaling.duration = 5.0f;
[graph addAnimation:scaling forKey:@"scaling"];

If the transform to value is greater than 1.0 and my initial transform
in 1.0, then there is some animation happening.

Unfortunately, I am not an expert in Animation and not sure how to
proceed.

I wanted to try your suggestion to use translation. My question is
what are the values I should be passing as arguments to the function
CATranform3DMakeTranslation ?

Thanks,
Javid

Javid

unread,
Jun 15, 2011, 4:14:20 PM6/15/11
to coreplot-discuss
Ok. I managed to get the animation to work to an extent that I feel is
sufficient for my application.
Instead of using CATransform3DMakeScale, I set the fromValue and
toValue to 0.0 and 1.0 respectively.
This animated the bar plot to scale from the center, so i moved the
anchor point of bar plot to 0,0 and the bar now animates vertically

here is the code:
barPlot.anchorPoint = CGPointMake(0.0, 0.0); // Moved anchor point,
initially it was set to center 0.5

CABasicAnimation *scaling = [CABasicAnimation
animationWithKeyPath:@"transform.scale.y"]; // scaling only on the y
axis
scaling.fromValue = [NSNumber numberWithFloat:0.0];
scaling.toValue = [NSNumber numberWithFloat:1.0];
scaling.duration = 3.0f; // Duration
scaling.removedOnCompletion = NO;
scaling.fillMode = kCAFillModeForwards;
[barPlot addAnimation:scaling forKey:@"scaling"];

TrialAccount Test

unread,
Jun 20, 2011, 5:32:03 AM6/20/11
to coreplot...@googlegroups.com
Hii...
While Animating Bar plot i.e., when bar grows vertically i want to update the DataLabelForPlot values.How can I achieve this.

Thanks
Charlene.
Reply all
Reply to author
Forward
0 new messages