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 116 additions and 94 deletions
@@ -12,7 +12,8 @@ @@ -12,7 +12,8 @@
12 12
13 13
14 @interface PNBarChart () { 14 @interface PNBarChart () {
15 - NSMutableArray *_labels; 15 + NSMutableArray *_xChartLabels;
  16 + NSMutableArray *_yChartLabels;
16 } 17 }
17 18
18 - (UIColor *)barColorAtIndex:(NSUInteger)index; 19 - (UIColor *)barColorAtIndex:(NSUInteger)index;
@@ -32,7 +33,8 @@ @@ -32,7 +33,8 @@
32 _barBackgroundColor = PNLightGrey; 33 _barBackgroundColor = PNLightGrey;
33 _labelTextColor = [UIColor grayColor]; 34 _labelTextColor = [UIColor grayColor];
34 _labelFont = [UIFont systemFontOfSize:11.0f]; 35 _labelFont = [UIFont systemFontOfSize:11.0f];
35 - _labels = [NSMutableArray array]; 36 + _xChartLabels = [NSMutableArray array];
  37 + _yChartLabels = [NSMutableArray array];
36 _bars = [NSMutableArray array]; 38 _bars = [NSMutableArray array];
37 _xLabelSkip = 1; 39 _xLabelSkip = 1;
38 _yLabelSum = 4; 40 _yLabelSum = 4;
@@ -58,8 +60,35 @@ @@ -58,8 +60,35 @@
58 [self getYValueMax:yValues]; 60 [self getYValueMax:yValues];
59 } 61 }
60 62
  63 + if (_yChartLabels) {
  64 + [self viewCleanupForCollection:_yChartLabels];
  65 + }else{
  66 + _yLabels = [NSMutableArray new];
  67 + }
  68 +
  69 + if (_showLabel) {
  70 + //Add y labels
  71 +
  72 + float yLabelSectionHeight = (self.frame.size.height - _chartMargin * 2 - xLabelHeight) / _yLabelSum;
  73 +
  74 + for (int index = 0; index < _yLabelSum; index++) {
  75 +
  76 + NSString *labelText = _yLabelFormatter((float)_yValueMax * ( (_yLabelSum - index) / (float)_yLabelSum ));
  77 +
  78 + PNChartLabel * label = [[PNChartLabel alloc] initWithFrame:CGRectMake(0,
  79 + yLabelSectionHeight * index + _chartMargin - yLabelHeight/2.0,
  80 + _yChartLabelWidth,
  81 + yLabelHeight)];
  82 + label.font = _labelFont;
  83 + label.textColor = _labelTextColor;
  84 + [label setTextAlignment:NSTextAlignmentRight];
  85 + label.text = labelText;
  86 +
  87 + [_yChartLabels addObject:label];
  88 + [self addSubview:label];
61 89
62 - _xLabelWidth = (self.frame.size.width - _chartMargin * 2) / [_yValues count]; 90 + }
  91 + }
63 } 92 }
64 93
65 - (void)getYValueMax:(NSArray *)yLabels 94 - (void)getYValueMax:(NSArray *)yLabels
@@ -77,24 +106,14 @@ @@ -77,24 +106,14 @@
77 { 106 {
78 _xLabels = xLabels; 107 _xLabels = xLabels;
79 108
80 - if (_showLabel) { 109 + if (_xChartLabels) {
81 - _xLabelWidth = (self.frame.size.width - _chartMargin * 2) / [xLabels count]; 110 + [self viewCleanupForCollection:_xChartLabels];
  111 + }else{
  112 + _xChartLabels = [NSMutableArray new];
82 } 113 }
83 -}  
84 -  
85 -  
86 -- (void)setStrokeColor:(UIColor *)strokeColor  
87 -{  
88 - _strokeColor = strokeColor;  
89 -}  
90 114
91 -  
92 -- (void)strokeChart  
93 -{  
94 - [self viewCleanupForCollection:_labels];  
95 - //Add Labels  
96 if (_showLabel) { 115 if (_showLabel) {
97 - //Add x labels 116 + _xLabelWidth = (self.frame.size.width - _chartMargin * 2) / [xLabels count];
98 int labelAddCount = 0; 117 int labelAddCount = 0;
99 for (int index = 0; index < _xLabels.count; index++) { 118 for (int index = 0; index < _xLabels.count; index++) {
100 labelAddCount += 1; 119 labelAddCount += 1;
@@ -119,34 +138,23 @@ @@ -119,34 +138,23 @@
119 self.frame.size.height - xLabelHeight - _chartMargin + label.frame.size.height /2.0 + _labelMarginTop); 138 self.frame.size.height - xLabelHeight - _chartMargin + label.frame.size.height /2.0 + _labelMarginTop);
120 labelAddCount = 0; 139 labelAddCount = 0;
121 140
122 - [_labels addObject:label]; 141 + [_xChartLabels addObject:label];
123 [self addSubview:label]; 142 [self addSubview:label];
124 } 143 }
125 } 144 }
  145 + }
  146 +}
126 147
127 - //Add y labels  
128 -  
129 - float yLabelSectionHeight = (self.frame.size.height - _chartMargin * 2 - xLabelHeight) / _yLabelSum;  
130 -  
131 - for (int index = 0; index < _yLabelSum; index++) {  
132 -  
133 - NSString *labelText = _yLabelFormatter((float)_yValueMax * ( (_yLabelSum - index) / (float)_yLabelSum ));  
134 148
135 - PNChartLabel * label = [[PNChartLabel alloc] initWithFrame:CGRectMake(0, 149 +- (void)setStrokeColor:(UIColor *)strokeColor
136 - yLabelSectionHeight * index + _chartMargin - yLabelHeight/2.0, 150 +{
137 - _yChartLabelWidth, 151 + _strokeColor = strokeColor;
138 - yLabelHeight)]; 152 +}
139 - label.font = _labelFont;  
140 - label.textColor = _labelTextColor;  
141 - [label setTextAlignment:NSTextAlignmentRight];  
142 - label.text = labelText;  
143 -  
144 - [_labels addObject:label];  
145 - [self addSubview:label];  
146 153
147 - }  
148 - }  
149 154
  155 +- (void)strokeChart
  156 +{
  157 + //Add Labels
150 158
151 [self viewCleanupForCollection:_bars]; 159 [self viewCleanupForCollection:_bars];
152 160
@@ -35,6 +35,8 @@ @@ -35,6 +35,8 @@
35 @property (nonatomic) UIFont *xLabelFont; 35 @property (nonatomic) UIFont *xLabelFont;
36 @property (nonatomic) UIColor *xLabelColor; 36 @property (nonatomic) UIColor *xLabelColor;
37 @property (nonatomic) CGFloat yValueMax; 37 @property (nonatomic) CGFloat yValueMax;
  38 +@property (nonatomic) CGFloat yFixedValueMax;
  39 +@property (nonatomic) CGFloat yFixedValueMin;
38 @property (nonatomic) CGFloat yValueMin; 40 @property (nonatomic) CGFloat yValueMin;
39 @property (nonatomic) NSInteger yLabelNum; 41 @property (nonatomic) NSInteger yLabelNum;
40 @property (nonatomic) CGFloat yLabelHeight; 42 @property (nonatomic) CGFloat yLabelHeight;
@@ -306,7 +306,6 @@ @@ -306,7 +306,6 @@
306 CGFloat yValue; 306 CGFloat yValue;
307 CGFloat innerGrade; 307 CGFloat innerGrade;
308 308
309 -  
310 UIBezierPath *progressline = [UIBezierPath bezierPath]; 309 UIBezierPath *progressline = [UIBezierPath bezierPath];
311 [progressline setLineWidth:chartData.lineWidth]; 310 [progressline setLineWidth:chartData.lineWidth];
312 [progressline setLineCapStyle:kCGLineCapRound]; 311 [progressline setLineCapStyle:kCGLineCapRound];
@@ -520,8 +519,8 @@ @@ -520,8 +519,8 @@
520 yMin = 0.0f; 519 yMin = 0.0f;
521 } 520 }
522 521
523 - _yValueMin = yMin; 522 + _yValueMin = _yFixedValueMin ? _yFixedValueMin : yMin ;
524 - _yValueMax = yMax + yMax / 10.0; 523 + _yValueMax = _yFixedValueMax ? _yFixedValueMax : yMax + yMax / 10.0;
525 524
526 if (_showLabel) { 525 if (_showLabel) {
527 [self setYLabels:yLabelsArray]; 526 [self setYLabels:yLabelsArray];
@@ -13,6 +13,8 @@ @@ -13,6 +13,8 @@
13 @interface PCChartViewController : UIViewController<PNChartDelegate> 13 @interface PCChartViewController : UIViewController<PNChartDelegate>
14 14
15 @property (nonatomic) PNLineChart * lineChart; 15 @property (nonatomic) PNLineChart * lineChart;
  16 +@property (nonatomic) PNBarChart * barChart;
  17 +
16 - (IBAction)changeValue:(id)sender; 18 - (IBAction)changeValue:(id)sender;
17 19
18 @end 20 @end
@@ -10,7 +10,6 @@ @@ -10,7 +10,6 @@
10 10
11 @implementation PCChartViewController 11 @implementation PCChartViewController
12 12
13 -  
14 -(void)viewDidLoad 13 -(void)viewDidLoad
15 { 14 {
16 [super viewDidLoad]; 15 [super viewDidLoad];
@@ -28,6 +27,11 @@ @@ -28,6 +27,11 @@
28 [self.lineChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5",@"SEP 6",@"SEP 7"]]; 27 [self.lineChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5",@"SEP 6",@"SEP 7"]];
29 self.lineChart.showCoordinateAxis = YES; 28 self.lineChart.showCoordinateAxis = YES;
30 29
  30 + //Use yFixedValueMax and yFixedValueMin to Fix the Max and Min Y Value
  31 + //Only if you needed
  32 + self.lineChart.yFixedValueMax = 500.0;
  33 + self.lineChart.yFixedValueMin = 1.0;
  34 +
31 // Line Chart #1 35 // Line Chart #1
32 NSArray * data01Array = @[@60.1, @160.1, @126.4, @262.2, @186.2, @127.2, @176.2]; 36 NSArray * data01Array = @[@60.1, @160.1, @126.4, @262.2, @186.2, @127.2, @176.2];
33 PNLineChartData *data01 = [PNLineChartData new]; 37 PNLineChartData *data01 = [PNLineChartData new];
@@ -52,12 +56,41 @@ @@ -52,12 +56,41 @@
52 56
53 self.lineChart.chartData = @[data01, data02]; 57 self.lineChart.chartData = @[data01, data02];
54 [self.lineChart strokeChart]; 58 [self.lineChart strokeChart];
55 -  
56 self.lineChart.delegate = self; 59 self.lineChart.delegate = self;
57 60
58 [self.view addSubview:lineChartLabel]; 61 [self.view addSubview:lineChartLabel];
59 [self.view addSubview:self.lineChart]; 62 [self.view addSubview:self.lineChart];
60 } 63 }
  64 + else if ([self.title isEqualToString:@"Bar Chart"])
  65 + {
  66 + UILabel * barChartLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 90, SCREEN_WIDTH, 30)];
  67 + barChartLabel.text = @"Bar Chart";
  68 + barChartLabel.textColor = PNFreshGreen;
  69 + barChartLabel.font = [UIFont fontWithName:@"Avenir-Medium" size:23.0];
  70 + barChartLabel.textAlignment = NSTextAlignmentCenter;
  71 +
  72 + self.barChart = [[PNBarChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];
  73 + self.barChart.backgroundColor = [UIColor clearColor];
  74 + self.barChart.yLabelFormatter = ^(CGFloat yValue){
  75 + CGFloat yValueParsed = yValue;
  76 + NSString * labelText = [NSString stringWithFormat:@"%1.f",yValueParsed];
  77 + return labelText;
  78 + };
  79 + self.barChart.labelMarginTop = 5.0;
  80 + [self.barChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5",@"SEP 6",@"SEP 7"]];
  81 + self.barChart.rotateForXAxisText = true ;
  82 + [self.barChart setYValues:@[@1,@24,@12,@18,@30,@10,@21]];
  83 + [self.barChart setStrokeColors:@[PNGreen,PNGreen,PNRed,PNGreen,PNGreen,PNYellow,PNGreen]];
  84 + // Adding gradient
  85 + self.barChart.barColorGradientStart = [UIColor blueColor];
  86 +
  87 + [self.barChart strokeChart];
  88 +
  89 + self.barChart.delegate = self;
  90 +
  91 + [self.view addSubview:barChartLabel];
  92 + [self.view addSubview:self.barChart];
  93 + }
61 } 94 }
62 95
63 96
@@ -71,8 +104,8 @@ @@ -71,8 +104,8 @@
71 104
72 105
73 - (IBAction)changeValue:(id)sender { 106 - (IBAction)changeValue:(id)sender {
74 - if ([self.title isEqualToString:@"Line Chart"]) {  
75 107
  108 + if ([self.title isEqualToString:@"Line Chart"]) {
76 109
77 // Line Chart #1 110 // Line Chart #1
78 NSArray * data01Array = @[@(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300)]; 111 NSArray * data01Array = @[@(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300)];
@@ -100,6 +133,33 @@ @@ -100,6 +133,33 @@
100 [self.lineChart updateChartData:@[data01, data02]]; 133 [self.lineChart updateChartData:@[data01, data02]];
101 134
102 } 135 }
  136 + else if ([self.title isEqualToString:@"Bar Chart"])
  137 + {
  138 + [self.barChart setXLabels:@[@"Jan 1",@"Jan 2",@"Jan 3",@"Jan 4",@"Jan 5",@"Jan 6",@"Jan 7"]];
  139 + [self.barChart setYValues:@[@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30)]];
  140 + }
  141 +
  142 +}
  143 +
  144 +- (void)userClickedOnBarAtIndex:(NSInteger)barIndex
  145 +{
  146 +
  147 + NSLog(@"Click on bar %@", @(barIndex));
  148 +
  149 + PNBar * bar = [self.barChart.bars objectAtIndex:barIndex];
  150 +
  151 + CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
  152 +
  153 + animation.fromValue = @1.0;
  154 + animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
  155 + animation.toValue = @1.1;
  156 + animation.duration = 0.2;
  157 + animation.repeatCount = 0;
  158 + animation.autoreverses = YES;
  159 + animation.removedOnCompletion = YES;
  160 + animation.fillMode = kCAFillModeForwards;
  161 +
  162 + [bar.layer addAnimation:animation forKey:@"Float"];
103 } 163 }
104 164
105 @end 165 @end
@@ -12,6 +12,4 @@ @@ -12,6 +12,4 @@
12 12
13 @interface PCChartsTableViewController : UITableViewController<PNChartDelegate> 13 @interface PCChartsTableViewController : UITableViewController<PNChartDelegate>
14 14
15 -@property (nonatomic) PNBarChart * barChart;  
16 -  
17 @end 15 @end
@@ -28,34 +28,6 @@ @@ -28,34 +28,6 @@
28 { 28 {
29 //Add bar chart 29 //Add bar chart
30 30
31 - UILabel * barChartLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 90, SCREEN_WIDTH, 30)];  
32 - barChartLabel.text = @"Bar Chart";  
33 - barChartLabel.textColor = PNFreshGreen;  
34 - barChartLabel.font = [UIFont fontWithName:@"Avenir-Medium" size:23.0];  
35 - barChartLabel.textAlignment = NSTextAlignmentCenter;  
36 -  
37 - self.barChart = [[PNBarChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];  
38 - self.barChart.backgroundColor = [UIColor clearColor];  
39 - self.barChart.yLabelFormatter = ^(CGFloat yValue){  
40 - CGFloat yValueParsed = yValue;  
41 - NSString * labelText = [NSString stringWithFormat:@"%1.f",yValueParsed];  
42 - return labelText;  
43 - };  
44 - self.barChart.labelMarginTop = 5.0;  
45 - [self.barChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5",@"SEP 6",@"SEP 7"]];  
46 - self.barChart.rotateForXAxisText = true ;  
47 - [self.barChart setYValues:@[@1,@24,@12,@18,@30,@10,@21]];  
48 - [self.barChart setStrokeColors:@[PNGreen,PNGreen,PNRed,PNGreen,PNGreen,PNYellow,PNGreen]];  
49 - // Adding gradient  
50 - self.barChart.barColorGradientStart = [UIColor blueColor];  
51 -  
52 - [self.barChart strokeChart];  
53 -  
54 - self.barChart.delegate = self;  
55 -  
56 - [viewController.view addSubview:barChartLabel];  
57 - [viewController.view addSubview:self.barChart];  
58 -  
59 viewController.title = @"Bar Chart"; 31 viewController.title = @"Bar Chart";
60 } else if ([segue.identifier isEqualToString:@"circleChart"]) 32 } else if ([segue.identifier isEqualToString:@"circleChart"])
61 { 33 {
@@ -117,25 +89,6 @@ @@ -117,25 +89,6 @@
117 NSLog(@"Click on line %f, %f, line index is %d",point.x, point.y, (int)lineIndex); 89 NSLog(@"Click on line %f, %f, line index is %d",point.x, point.y, (int)lineIndex);
118 } 90 }
119 91
120 -- (void)userClickedOnBarAtIndex:(NSInteger)barIndex  
121 -{  
122 -  
123 - NSLog(@"Click on bar %@", @(barIndex));  
124 -  
125 - PNBar * bar = [self.barChart.bars objectAtIndex:barIndex];  
126 92
127 - CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];  
128 -  
129 - animation.fromValue = @1.0;  
130 - animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];  
131 - animation.toValue = @1.1;  
132 - animation.duration = 0.2;  
133 - animation.repeatCount = 0;  
134 - animation.autoreverses = YES;  
135 - animation.removedOnCompletion = YES;  
136 - animation.fillMode = kCAFillModeForwards;  
137 -  
138 - [bar.layer addAnimation:animation forKey:@"Float"];  
139 -}  
140 93
141 @end 94 @end