如何在 Core Plot 中为条形图的外观设置动画？

Question

当第一次使用 Core Plot 显示条形图时，我希望条形向上生长，直到达到正确的高度。

您将如何使用这个框架创建这样的动画？

Answer 1

这就是我所做的：

1. 在我的 viewDidLoad 控制器的方法中，我创建了 CPTXYGraph：

   graph = [[CPTXYGraph alloc] initWithFrame:self.view.bounds];
   

2. 我向空图表添加了动画：

   CAKeyframeAnimation *scale = [CAKeyframeAnimationanimationWithKeyPath:@"transform"];
   

3. 然后在animationDidStop 委托的方法中，我向图表添加了绘图数据和动画：

   CABasicAnimation *anim = [CABasicAnimationanimationWithKeyPath:@"transform.scale.y"];
   [动画设置持续时间：2.0f]；
   
   anim.toValue = [NSNumber numberWithFloat:1.0f];
   anim.fromValue = [NSNumber numberWithFloat:0.0f];
   anim.removedOnCompletion = NO;
   anim.delegate = self；
   anim.fillMode = kCAFillModeForwards;
   
   gPlot.anchorPoint = CGPointMake(0.0, 0.0);
   
   [gPlot addAnimation:anim forKey:@"grow"];
   
   [graph addPlot:gPlot ];// 重要的是，我将绘图数据添加到了图表中:)。
   

Answer 2

为 CPTBarPlot 添加动画，如下所示：

CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
[animation setDuration:1];
CATransform3D transform = CATransform3DMakeScale(1, 0.0001, 1);
// offsetY=[PlotDisplayAreaUnderXAxisHeight]-[PlotDisplayAreaHeight]/2
transform = CATransform3DConcat(transform, CATransform3DMakeTranslation(0, offsetY, 0));
animation.fromValue = [NSValue valueWithCATransform3D:transform];
animation.toValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];
[barPlot addAnimation:animation forKey:@"barGrowth"];

Answer 3

感谢米歇尔的精彩回答。

我已将她的回答中的示例上传到 Github，供那些想要下载演示并立即开始工作的人使用！

https://github.com/mayuur/CoreplotAnimation

享受编码吧！

Answer 4

这非常类似于：如何对使用 core-plot 库开发饼图？

Answer 5

像这样添加不透明动画...

CABasicAnimation *fadeInAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"];
fadeInAnimation.duration = 1.0f;
fadeInAnimation.removedOnCompletion = NO;
fadeInAnimation.fillMode = kCAFillModeForwards;
fadeInAnimation.toValue = [NSNumber numberWithFloat:1.0];
[xSquaredPlot addAnimation:fadeInAnimation forKey:@"animateOpacity"];