How to animate pie charts designed using the main story library?

In the Roambi iPhone app, the pie chart shown can be animated to rotate with the user as if he were spinning a disc. We can hold and do a lot of things with it.

Someone mentioned that the Roambi application was developed using the main story library:

Which library uses the Roambi iPhone graphics app?

How can I manipulate a pie chart designed using kernel graph?

+6
iphone core-plot
source share
3 answers

A quick look at the Core Plot source code shows that CPPieChart inheritance is as follows:

CPPieChart : CPPlot : CPAnnotationHostLayer : CPLayer : CALayer

So you can see that at the end CPPieChart is just a subclass of CALayer . Here I may be completely wrong, but there is nothing that would indicate that it is impossible to animate like any other CALayer . Try the following code to rotate the layer 360 degrees:

 CABasicAnimation *rotation = [CABasicAnimation animationWithKeyPath:@"transform"]; CATransform3D transform = CATransform3DMakeRotation(DegreesToRadians(360), 0, 0, 1); rotation.toValue = [NSValue valueWithCATransform3D:transform]; rotation.duration = 10.0f; [pieChart addAnimation:rotation forKey:@"rotation"]; 

If you can get this working, then you just need to read the accelerometer values ​​and convert them to rotation angles.

+6
source share

For a simple pie chart, even with the above animations, Core Plot is not required. If you only need a Core Plot solution, please ignore it. However, here is a simple solution that does not require external packages or even any frameworks.

Create a UIView called PieChartView. In PieChartView.h:

 #import <UIKit/UIKit.h> @interface PieChartView : UIView { float zeroAngle; NSMutableArray *valueArray; NSMutableArray *colorArray; } @property (nonatomic) float zeroAngle; @property (nonatomic, retain) NSMutableArray *valueArray; @property (nonatomic, retain) NSMutableArray *colorArray; @end 

Then implementation in PieChartView.m:

 #import "PieChartView.h" @implementation PieChartView @synthesize zeroAngle; @synthesize valueArray, colorArray; - (id)initWithFrame:(CGRect)frame { if ((self = [super initWithFrame:frame])) { } return self; } - (void)drawRect:(CGRect)rect { CGContextRef context = UIGraphicsGetCurrentContext(); // DETERMINE NUMBER OF WEDGES OF PIE int wedges = [valueArray count]; if (wedges > [colorArray count]) { NSLog(@"INSUFFICENT COLORS FOR PIE CHART: Please add %d additional colors.",wedges-[colorArray count]); for (int i=[colorArray count] ; i<wedges ; ++i) { [colorArray addObject:[UIColor whiteColor]]; } } // DETERMINE TOTAL VOLUME OF PIE float sum = 0.0; for (int i=0; i<wedges ; ++i) { sum += [[valueArray objectAtIndex:i] floatValue]; } float frac = 2.0*M_PI/sum; // DETERMINE CENTER AND MAXIMUM RADIUS OF INSCRIBED CIRCLE int center_x = rect.size.width/2.0; int center_y = rect.size.height/2.0; int radius = (center_x > center_y ? center_x : center_y); // DRAW WEDGES CLOCKWISE FROM POSITIVE X-AXIS float startAngle=zeroAngle; float endAngle=zeroAngle; for (int i=0; i<wedges; ++i) { startAngle = endAngle; endAngle += [[valueArray objectAtIndex:i] floatValue]*frac; [[colorArray objectAtIndex:i] setFill]; CGContextMoveToPoint(context, center_x, center_y); CGContextAddArc(context, center_x, center_y, radius, startAngle, endAngle, 0); CGContextClosePath(context); CGContextFillPath(context); } } - (void)dealloc { [valueArray release]; [colorArray release]; [super dealloc]; } @end 

Now you can bind the float zeroAngle to the accelerometer in any way that you want to achieve the desired animation.

+5
source share

I did not know CorePlot, and maybe it will be useful for me in the near future, so I just looked at it. CorePlot is interesting and active.

About animation using CorePlot:

  • The CorePlot documentation mentions the Animation System , but not yet implemented ...
  • Even if based on Core Animation , this does not mean that the CorePlot chart will be easy to animate.

Interesting reading on the topic in google groups.

So, here are your options (according to my preference):

  • Look at another graphics library that handles animation, such as Roambi.
  • Implement CorePlot based animation (meaning a good understanding of this structure and Core Animation )
  • Do it yourself, depending on what you want, maybe it’s not so difficult again ... But Core Animation skills are needed again.

I doubt Roambi uses CorePlot, but if so, they use it as a base with custom TONS in home code ...

+3
source share

All Articles