iOS / PNChart

Go to a project
Toggle navigation Toggle navigation pinning
kevinzhow
b554b0c8 1 parent 57d98275

Add bar chart labels update

Inline Side-by-side
Showing 7 changed files with 122 additions and 100 deletions
... ... @@ -12,7 +12,8 @@
@interface PNBarChart () {
NSMutableArray *_labels;
NSMutableArray *_xChartLabels;
NSMutableArray *_yChartLabels;
}
- (UIColor *)barColorAtIndex:(NSUInteger)index;
... ... @@ -32,7 +33,8 @@
_barBackgroundColor = PNLightGrey;
_labelTextColor = [UIColor grayColor];
_labelFont = [UIFont systemFontOfSize:11.0f];
_labels = [NSMutableArray array];
_xChartLabels = [NSMutableArray array];
_yChartLabels = [NSMutableArray array];
_bars = [NSMutableArray array];
_xLabelSkip = 1;
_yLabelSum = 4;
... ... @@ -57,9 +59,36 @@
} else {
[self getYValueMax:yValues];
}
_xLabelWidth = (self.frame.size.width - _chartMargin * 2) / [_yValues count];
if (_yChartLabels) {
[self viewCleanupForCollection:_yChartLabels];
}else{
_yLabels = [NSMutableArray new];
}
if (_showLabel) {
//Add y labels
float yLabelSectionHeight = (self.frame.size.height - _chartMargin * 2 - xLabelHeight) / _yLabelSum;
for (int index = 0; index < _yLabelSum; index++) {
NSString *labelText = _yLabelFormatter((float)_yValueMax * ( (_yLabelSum - index) / (float)_yLabelSum ));
PNChartLabel * label = [[PNChartLabel alloc] initWithFrame:CGRectMake(0,
yLabelSectionHeight * index + _chartMargin - yLabelHeight/2.0,
_yChartLabelWidth,
yLabelHeight)];
label.font = _labelFont;
label.textColor = _labelTextColor;
[label setTextAlignment:NSTextAlignmentRight];
label.text = labelText;
[_yChartLabels addObject:label];
[self addSubview:label];
}
}
}
- (void)getYValueMax:(NSArray *)yLabels
... ... @@ -76,29 +105,19 @@
- (void)setXLabels:(NSArray *)xLabels
{
_xLabels = xLabels;
if (_showLabel) {
_xLabelWidth = (self.frame.size.width - _chartMargin * 2) / [xLabels count];
if (_xChartLabels) {
[self viewCleanupForCollection:_xChartLabels];
}else{
_xChartLabels = [NSMutableArray new];
}
}
- (void)setStrokeColor:(UIColor *)strokeColor
{
_strokeColor = strokeColor;
}
- (void)strokeChart
{
[self viewCleanupForCollection:_labels];
//Add Labels
if (_showLabel) {
//Add x labels
_xLabelWidth = (self.frame.size.width - _chartMargin * 2) / [xLabels count];
int labelAddCount = 0;
for (int index = 0; index < _xLabels.count; index++) {
labelAddCount += 1;
if (labelAddCount == _xLabelSkip) {
NSString *labelText = [_xLabels[index] description];
PNChartLabel * label = [[PNChartLabel alloc] initWithFrame:CGRectZero];
... ... @@ -118,35 +137,24 @@
label.center = CGPointMake(labelXPosition,
self.frame.size.height - xLabelHeight - _chartMargin + label.frame.size.height /2.0 + _labelMarginTop);
labelAddCount = 0;
[_labels addObject:label];
[_xChartLabels addObject:label];
[self addSubview:label];
}
}
}
}
//Add y labels
float yLabelSectionHeight = (self.frame.size.height - _chartMargin * 2 - xLabelHeight) / _yLabelSum;
for (int index = 0; index < _yLabelSum; index++) {
NSString *labelText = _yLabelFormatter((float)_yValueMax * ( (_yLabelSum - index) / (float)_yLabelSum ));
PNChartLabel * label = [[PNChartLabel alloc] initWithFrame:CGRectMake(0,
yLabelSectionHeight * index + _chartMargin - yLabelHeight/2.0,
_yChartLabelWidth,
yLabelHeight)];
label.font = _labelFont;
label.textColor = _labelTextColor;
[label setTextAlignment:NSTextAlignmentRight];
label.text = labelText;
[_labels addObject:label];
[self addSubview:label];
- (void)setStrokeColor:(UIColor *)strokeColor
{
_strokeColor = strokeColor;
}
}
}
- (void)strokeChart
{
//Add Labels
[self viewCleanupForCollection:_bars];
... ...
... ... @@ -35,6 +35,8 @@
@property (nonatomic) UIFont *xLabelFont;
@property (nonatomic) UIColor *xLabelColor;
@property (nonatomic) CGFloat yValueMax;
@property (nonatomic) CGFloat yFixedValueMax;
@property (nonatomic) CGFloat yFixedValueMin;
@property (nonatomic) CGFloat yValueMin;
@property (nonatomic) NSInteger yLabelNum;
@property (nonatomic) CGFloat yLabelHeight;
... ...
... ... @@ -305,7 +305,6 @@
CGFloat yValue;
CGFloat innerGrade;
UIBezierPath *progressline = [UIBezierPath bezierPath];
[progressline setLineWidth:chartData.lineWidth];
... ... @@ -520,8 +519,8 @@
yMin = 0.0f;
}
_yValueMin = yMin;
_yValueMax = yMax + yMax / 10.0;
_yValueMin = _yFixedValueMin ? _yFixedValueMin : yMin ;
_yValueMax = _yFixedValueMax ? _yFixedValueMax : yMax + yMax / 10.0;
if (_showLabel) {
[self setYLabels:yLabelsArray];
... ...
... ... @@ -13,6 +13,8 @@
@interface PCChartViewController : UIViewController<PNChartDelegate>
@property (nonatomic) PNLineChart * lineChart;
@property (nonatomic) PNBarChart * barChart;
- (IBAction)changeValue:(id)sender;
@end
... ...
... ... @@ -10,7 +10,6 @@
@implementation PCChartViewController
-(void)viewDidLoad
{
[super viewDidLoad];
... ... @@ -28,6 +27,11 @@
[self.lineChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5",@"SEP 6",@"SEP 7"]];
self.lineChart.showCoordinateAxis = YES;
//Use yFixedValueMax and yFixedValueMin to Fix the Max and Min Y Value
//Only if you needed
self.lineChart.yFixedValueMax = 500.0;
self.lineChart.yFixedValueMin = 1.0;
// Line Chart #1
NSArray * data01Array = @[@60.1, @160.1, @126.4, @262.2, @186.2, @127.2, @176.2];
PNLineChartData *data01 = [PNLineChartData new];
... ... @@ -52,12 +56,41 @@
self.lineChart.chartData = @[data01, data02];
[self.lineChart strokeChart];
self.lineChart.delegate = self;
[self.view addSubview:lineChartLabel];
[self.view addSubview:self.lineChart];
}
else if ([self.title isEqualToString:@"Bar Chart"])
{
UILabel * barChartLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 90, SCREEN_WIDTH, 30)];
barChartLabel.text = @"Bar Chart";
barChartLabel.textColor = PNFreshGreen;
barChartLabel.font = [UIFont fontWithName:@"Avenir-Medium" size:23.0];
barChartLabel.textAlignment = NSTextAlignmentCenter;
self.barChart = [[PNBarChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];
self.barChart.backgroundColor = [UIColor clearColor];
self.barChart.yLabelFormatter = ^(CGFloat yValue){
CGFloat yValueParsed = yValue;
NSString * labelText = [NSString stringWithFormat:@"%1.f",yValueParsed];
return labelText;
};
self.barChart.labelMarginTop = 5.0;
[self.barChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5",@"SEP 6",@"SEP 7"]];
self.barChart.rotateForXAxisText = true ;
[self.barChart setYValues:@[@1,@24,@12,@18,@30,@10,@21]];
[self.barChart setStrokeColors:@[PNGreen,PNGreen,PNRed,PNGreen,PNGreen,PNYellow,PNGreen]];
// Adding gradient
self.barChart.barColorGradientStart = [UIColor blueColor];
[self.barChart strokeChart];
self.barChart.delegate = self;
[self.view addSubview:barChartLabel];
[self.view addSubview:self.barChart];
}
}
... ... @@ -71,9 +104,9 @@
- (IBAction)changeValue:(id)sender {
if ([self.title isEqualToString:@"Line Chart"]) {
// Line Chart #1
NSArray * data01Array = @[@(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300)];
PNLineChartData *data01 = [PNLineChartData new];
... ... @@ -100,6 +133,33 @@
[self.lineChart updateChartData:@[data01, data02]];
}
else if ([self.title isEqualToString:@"Bar Chart"])
{
[self.barChart setXLabels:@[@"Jan 1",@"Jan 2",@"Jan 3",@"Jan 4",@"Jan 5",@"Jan 6",@"Jan 7"]];
[self.barChart setYValues:@[@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30)]];
}
}
- (void)userClickedOnBarAtIndex:(NSInteger)barIndex
{
NSLog(@"Click on bar %@", @(barIndex));
PNBar * bar = [self.barChart.bars objectAtIndex:barIndex];
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
animation.fromValue = @1.0;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
animation.toValue = @1.1;
animation.duration = 0.2;
animation.repeatCount = 0;
animation.autoreverses = YES;
animation.removedOnCompletion = YES;
animation.fillMode = kCAFillModeForwards;
[bar.layer addAnimation:animation forKey:@"Float"];
}
@end
... ...
... ... @@ -12,6 +12,4 @@
@interface PCChartsTableViewController : UITableViewController<PNChartDelegate>
@property (nonatomic) PNBarChart * barChart;
@end
... ...
... ... @@ -28,34 +28,6 @@
{
//Add bar chart
UILabel * barChartLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 90, SCREEN_WIDTH, 30)];
barChartLabel.text = @"Bar Chart";
barChartLabel.textColor = PNFreshGreen;
barChartLabel.font = [UIFont fontWithName:@"Avenir-Medium" size:23.0];
barChartLabel.textAlignment = NSTextAlignmentCenter;
self.barChart = [[PNBarChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];
self.barChart.backgroundColor = [UIColor clearColor];
self.barChart.yLabelFormatter = ^(CGFloat yValue){
CGFloat yValueParsed = yValue;
NSString * labelText = [NSString stringWithFormat:@"%1.f",yValueParsed];
return labelText;
};
self.barChart.labelMarginTop = 5.0;
[self.barChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5",@"SEP 6",@"SEP 7"]];
self.barChart.rotateForXAxisText = true ;
[self.barChart setYValues:@[@1,@24,@12,@18,@30,@10,@21]];
[self.barChart setStrokeColors:@[PNGreen,PNGreen,PNRed,PNGreen,PNGreen,PNYellow,PNGreen]];
// Adding gradient
self.barChart.barColorGradientStart = [UIColor blueColor];
[self.barChart strokeChart];
self.barChart.delegate = self;
[viewController.view addSubview:barChartLabel];
[viewController.view addSubview:self.barChart];
viewController.title = @"Bar Chart";
} else if ([segue.identifier isEqualToString:@"circleChart"])
{
... ... @@ -117,25 +89,6 @@
NSLog(@"Click on line %f, %f, line index is %d",point.x, point.y, (int)lineIndex);
}
- (void)userClickedOnBarAtIndex:(NSInteger)barIndex
{
NSLog(@"Click on bar %@", @(barIndex));
PNBar * bar = [self.barChart.bars objectAtIndex:barIndex];
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
animation.fromValue = @1.0;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
animation.toValue = @1.1;
animation.duration = 0.2;
animation.repeatCount = 0;
animation.autoreverses = YES;
animation.removedOnCompletion = YES;
animation.fillMode = kCAFillModeForwards;
[bar.layer addAnimation:animation forKey:@"Float"];
}
@end
... ...