iOS / PNChart

Go to a project
Toggle navigation Toggle navigation pinning
kevinzhow
96490bb6 2 parents dfeeadb8 5f2fc8ed

Merge remote-tracking branch 'origin/develop' 

Conflicts:
	PNChart.podspec
Expand all
Inline Side-by-side
Showing 15 changed files with 418 additions and 361 deletions
... ... @@ -16,7 +16,7 @@ Pod::Spec.new do |s|
#
s.name = "PNChart"
s.version = "0.5.6"
s.version = "0.6.0"
s.summary = "A simple and beautiful chart lib with animation used in Piner for iOS"
s.description = <<-DESC
... ... @@ -41,141 +41,6 @@ Pod::Spec.new do |s|
You will need LLVM 3.0 or later in order to build PNChart.
## Usage
### Cocoapods
[CocoaPods](http://cocoapods.org) is the recommended way to add PNChart to your project.
1. Add a pod entry for PNChart to your Podfile `pod 'PNChart', '~> 0.5'`
2. Install the pod(s) by running `pod install`.
3. Include PNChart wherever you need it with `#import "PNChart.h"`.
### Copy the PNChart folder to your project
[![](https://dl.dropboxusercontent.com/u/1599662/line.png)](https://dl.dropboxusercontent.com/u/1599662/line.png)
```objective-c
#import "PNChart.h"
//For LineChart
PNLineChart * lineChart = [[PNLineChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];
[lineChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5"]];
// Line Chart No.1
NSArray * data01Array = @[@60.1, @160.1, @126.4, @262.2, @186.2];
PNLineChartData *data01 = [PNLineChartData new];
data01.color = PNFreshGreen;
data01.itemCount = lineChart.xLabels.count;
data01.getData = ^(NSUInteger index) {
CGFloat yValue = [data01Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
// Line Chart No.2
NSArray * data02Array = @[@20.1, @180.1, @26.4, @202.2, @126.2];
PNLineChartData *data02 = [PNLineChartData new];
data02.color = PNTwitterColor;
data02.itemCount = lineChart.xLabels.count;
data02.getData = ^(NSUInteger index) {
CGFloat yValue = [data02Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
lineChart.chartData = @[data01, data02];
[lineChart strokeChart];
```
[![](https://dl.dropboxusercontent.com/u/1599662/bar.png)](https://dl.dropboxusercontent.com/u/1599662/bar.png)
```objective-c
#import "PNChart.h"
//For BarChart
PNBarChart * barChart = [[PNBarChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];
[barChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5"]];
[barChart setYValues:@[@1, @10, @2, @6, @3]];
[barChart strokeChart];
```
[![](https://dl.dropboxusercontent.com/u/1599662/circle.png)](https://dl.dropboxusercontent.com/u/1599662/circle.png)
```objective-c
#import "PNChart.h"
//For CircleChart
PNCircleChart * circleChart = [[PNCircleChart alloc] initWithFrame:CGRectMake(0, 80.0, SCREEN_WIDTH, 100.0) andTotal:[NSNumber numberWithInt:100] andCurrent:[NSNumber numberWithInt:60] andClockwise:NO];
circleChart.backgroundColor = [UIColor clearColor];
[circleChart setStrokeColor:PNGreen];
[circleChart strokeChart];
```
[![](https://dl.dropboxusercontent.com/u/1599662/pie.png)](https://dl.dropboxusercontent.com/u/1599662/pie.png)
```objective-c
# import "PNChart.h"
//For PieChart
NSArray *items = @[[PNPieChartDataItem dataItemWithValue:10 color:PNRed],
[PNPieChartDataItem dataItemWithValue:20 color:PNBlue description:@"WWDC"],
[PNPieChartDataItem dataItemWithValue:40 color:PNGreen description:@"GOOL I/O"],
];
PNPieChart *pieChart = [[PNPieChart alloc] initWithFrame:CGRectMake(40.0, 155.0, 240.0, 240.0) items:items];
pieChart.descriptionTextColor = [UIColor whiteColor];
pieChart.descriptionTextFont = [UIFont fontWithName:@"Avenir-Medium" size:14.0];
[pieChart strokeChart];
```
#### Callback
Currently callback only works on Linechart
```objective-c
#import "PNChart.h"
//For LineChart
lineChart.delegate = self;
```
```objective-c
//For DelegateMethod
-(void)userClickedOnLineKeyPoint:(CGPoint)point lineIndex:(NSInteger)lineIndex pointIndex:(NSInteger)pointIndex{
NSLog(@"Click Key on line %f, %f line index is %d and point index is %d",point.x, point.y,(int)lineIndex, (int)pointIndex);
}
-(void)userClickedOnLinePoint:(CGPoint)point lineIndex:(NSInteger)lineIndex{
NSLog(@"Click on line %f, %f, line index is %d",point.x, point.y, (int)lineIndex);
}
```
## License
This code is distributed under the terms and conditions of the [MIT license](LICENSE).
## SpecialThanks
[@lexrus](http://twitter.com/lexrus) CocoaPods Spec
DESC
s.homepage = "https://github.com/kevinzhow/PNChart"
... ... @@ -225,7 +90,7 @@ Pod::Spec.new do |s|
# Supports git, hg, bzr, svn and HTTP.
#
s.source = { :git => "https://github.com/kevinzhow/PNChart.git", :tag => "0.5.6" }
s.source = { :git => "https://github.com/kevinzhow/PNChart.git", :tag => "0.6.0" }
# ――― Source Code ―――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――― #
... ...
... ... @@ -18,5 +18,6 @@
@property (nonatomic) UIColor *barColor;
@property (nonatomic) UIColor *barColorGradientStart;
@property (nonatomic) CGFloat barRadius;
@property (nonatomic) CAShapeLayer *gradientMask;
@end
... ...
... ... @@ -38,7 +38,8 @@
- (void)setGrade:(float)grade
{
_grade = grade;
NSLog(@"New garde %f",grade);
UIBezierPath *progressline = [UIBezierPath bezierPath];
[progressline moveToPoint:CGPointMake(self.frame.size.width / 2.0, self.frame.size.height)];
... ... @@ -46,7 +47,7 @@
[progressline setLineWidth:1.0];
[progressline setLineCapStyle:kCGLineCapSquare];
_chartLine.path = progressline.CGPath;
if (_barColor) {
_chartLine.strokeColor = [_barColor CGColor];
... ... @@ -55,6 +56,26 @@
_chartLine.strokeColor = [PNGreen CGColor];
}
if (_grade) {
CABasicAnimation * pathAnimation = [CABasicAnimation animationWithKeyPath:@"path"];
pathAnimation.fromValue = (id)_chartLine.path;
pathAnimation.toValue = (id)[progressline CGPath];
pathAnimation.duration = 0.5f;
pathAnimation.autoreverses = NO;
pathAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
[_chartLine addAnimation:pathAnimation forKey:@"animationKey"];
_chartLine.path = progressline.CGPath;
if (_barColorGradientStart) {
// Add gradient
[self.gradientMask addAnimation:pathAnimation forKey:@"animationKey"];
self.gradientMask.path = progressline.CGPath;
}
}else{
CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
pathAnimation.duration = 1.0;
pathAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
... ... @@ -64,16 +85,17 @@
_chartLine.strokeEnd = 1.0;
_chartLine.path = progressline.CGPath;
// Check if user wants to add a gradient from the start color to the bar color
if (_barColorGradientStart) {
// Add gradient
CAShapeLayer *gradientMask = [CAShapeLayer layer];
gradientMask.fillColor = [[UIColor clearColor] CGColor];
gradientMask.strokeColor = [[UIColor blackColor] CGColor];
gradientMask.lineWidth = self.frame.size.width;
gradientMask.frame = CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.height);
gradientMask.path = progressline.CGPath;
self.gradientMask = [CAShapeLayer layer];
self.gradientMask.fillColor = [[UIColor clearColor] CGColor];
self.gradientMask.strokeColor = [[UIColor blackColor] CGColor];
self.gradientMask.lineWidth = self.frame.size.width;
self.gradientMask.frame = CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.height);
self.gradientMask.path = progressline.CGPath;
CAGradientLayer *gradientLayer = [CAGradientLayer layer];
... ... @@ -87,14 +109,17 @@
];
gradientLayer.colors = colors;
[gradientLayer setMask:gradientMask];
[gradientLayer setMask:self.gradientMask];
[_chartLine addSublayer:gradientLayer];
gradientMask.strokeEnd = 1.0;
[gradientMask addAnimation:pathAnimation forKey:@"strokeEndAnimation"];
self.gradientMask.strokeEnd = 1.0;
[self.gradientMask addAnimation:pathAnimation forKey:@"strokeEndAnimation"];
}
}
_grade = grade;
}
... ...
... ... @@ -36,6 +36,9 @@ typedef NSString *(^PNYLabelFormatter)(CGFloat yLabelValue);
@property (nonatomic) NSArray *strokeColors;
/** Update Values. */
- (void)updateChartData:(NSArray *)data;
/** Changes chart margin. */
@property (nonatomic) CGFloat yChartLabelWidth;
... ...
... ... @@ -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;
... ... @@ -58,8 +60,40 @@
[self getYValueMax:yValues];
}
if (_yChartLabels) {
[self viewCleanupForCollection:_yChartLabels];
}else{
_yLabels = [NSMutableArray new];
}
if (_showLabel) {
//Add y labels
float yLabelSectionHeight = (self.frame.size.height - _chartMargin * 2 - xLabelHeight) / _yLabelSum;
_xLabelWidth = (self.frame.size.width - _chartMargin * 2) / [_yValues count];
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)updateChartData:(NSArray *)data{
self.yValues = data;
[self updateBar];
}
- (void)getYValueMax:(NSArray *)yLabels
... ... @@ -77,24 +111,14 @@
{
_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;
... ... @@ -119,52 +143,33 @@
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];
}
}
}
[self viewCleanupForCollection:_bars];
- (void)setStrokeColor:(UIColor *)strokeColor
{
_strokeColor = strokeColor;
}
- (void)updateBar
{
//Add bars
CGFloat chartCavanHeight = self.frame.size.height - _chartMargin * 2 - xLabelHeight;
NSInteger index = 0;
for (NSNumber *valueString in _yValues) {
float value = [valueString floatValue];
float grade = (float)value / (float)_yValueMax;
if (isnan(grade)) {
grade = 0;
}
PNBar *bar;
if (_bars.count == _yValues.count) {
bar = [_bars objectAtIndex:index];
}else{
CGFloat barWidth;
CGFloat barXPosition;
... ... @@ -200,23 +205,40 @@
}else{
bar.barColor = [self barColorAtIndex:index];
}
//Height Of Bar
bar.grade = grade;
// Add gradient
bar.barColorGradientStart = _barColorGradientStart;
//For Click Index
bar.tag = index;
[_bars addObject:bar];
[self addSubview:bar];
}
//Height Of Bar
float value = [valueString floatValue];
float grade = (float)value / (float)_yValueMax;
if (isnan(grade)) {
grade = 0;
}
bar.grade = grade;
index += 1;
}
}
- (void)strokeChart
{
//Add Labels
[self viewCleanupForCollection:_bars];
//Update Bar
[self updateBar];
//Add chart border lines
... ...
... ... @@ -22,6 +22,7 @@ typedef NS_ENUM (NSUInteger, PNChartFormatType) {
- (void)strokeChart;
- (void)growChartByAmount:(NSNumber *)growAmount;
- (void)updateChartByCurrent:(NSNumber *)current;
- (id)initWithFrame:(CGRect)frame
total:(NSNumber *)total
current:(NSNumber *)current
... ... @@ -37,7 +38,9 @@ typedef NS_ENUM (NSUInteger, PNChartFormatType) {
@property (nonatomic) NSTimeInterval duration;
@property (nonatomic) PNChartFormatType chartType;
@property (nonatomic) CAShapeLayer *circle;
@property (nonatomic) CAShapeLayer *gradientMask;
@property (nonatomic) CAShapeLayer *circleBackground;
@end
... ...
... ... @@ -116,14 +116,14 @@
if (_strokeColorGradientStart) {
// Add gradient
CAShapeLayer *gradientMask = [CAShapeLayer layer];
gradientMask.fillColor = [[UIColor clearColor] CGColor];
gradientMask.strokeColor = [[UIColor blackColor] CGColor];
gradientMask.lineWidth = _circle.lineWidth;
gradientMask.lineCap = kCALineCapRound;
self.gradientMask = [CAShapeLayer layer];
self.gradientMask.fillColor = [[UIColor clearColor] CGColor];
self.gradientMask.strokeColor = [[UIColor blackColor] CGColor];
self.gradientMask.lineWidth = _circle.lineWidth;
self.gradientMask.lineCap = kCALineCapRound;
CGRect gradientFrame = CGRectMake(0, 0, 2*self.bounds.size.width, 2*self.bounds.size.height);
gradientMask.frame = gradientFrame;
gradientMask.path = _circle.path;
self.gradientMask.frame = gradientFrame;
self.gradientMask.path = _circle.path;
CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.startPoint = CGPointMake(0.5,1.0);
... ... @@ -136,13 +136,13 @@
];
gradientLayer.colors = colors;
[gradientLayer setMask:gradientMask];
[gradientLayer setMask:self.gradientMask];
[_circle addSublayer:gradientLayer];
gradientMask.strokeEnd = [_current floatValue] / [_total floatValue];
self.gradientMask.strokeEnd = [_current floatValue] / [_total floatValue];
[gradientMask addAnimation:pathAnimation forKey:@"strokeEndAnimation"];
[self.gradientMask addAnimation:pathAnimation forKey:@"strokeEndAnimation"];
}
}
... ... @@ -153,16 +153,27 @@
NSNumber *updatedValue = [NSNumber numberWithFloat:[_current floatValue] + [growAmount floatValue]];
// Add animation
[self updateChartByCurrent:updatedValue];
}
-(void)updateChartByCurrent:(NSNumber *)current{
// Add animation
CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
pathAnimation.duration = self.duration;
pathAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
pathAnimation.fromValue = @([_current floatValue] / [_total floatValue]);
pathAnimation.toValue = @([updatedValue floatValue] / [_total floatValue]);
_circle.strokeEnd = [updatedValue floatValue] / [_total floatValue];
pathAnimation.toValue = @([current floatValue] / [_total floatValue]);
_circle.strokeEnd = [current floatValue] / [_total floatValue];
if (_strokeColorGradientStart) {
self.gradientMask.strokeEnd = _circle.strokeEnd;
[self.gradientMask addAnimation:pathAnimation forKey:@"strokeEndAnimation"];
}
[_circle addAnimation:pathAnimation forKey:@"strokeEndAnimation"];
[self.countingLabel countFrom:fmin([_current floatValue], [_total floatValue]) to:fmin([_current floatValue] + [growAmount floatValue], [_total floatValue]) withDuration:self.duration];
_current = updatedValue;
[self.countingLabel countFrom:fmin([_current floatValue], [_total floatValue]) to:fmin([current floatValue], [_total floatValue]) withDuration:self.duration];
_current = current;
}
@end
... ...
... ... @@ -28,10 +28,15 @@
@property (nonatomic) NSArray *chartData;
@property (nonatomic) NSMutableArray *pathPoints;
@property (nonatomic) NSMutableArray *xChartLabels;
@property (nonatomic) NSMutableArray *yChartLabels;
@property (nonatomic) CGFloat xLabelWidth;
@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;
... ... @@ -59,4 +64,10 @@
- (void)setXLabels:(NSArray *)xLabels withWidth:(CGFloat)width;
/**
* Update Chart Value
*/
- (void)updateChartData:(NSArray *)data;
@end
... ...
This diff is collapsed. Click to expand it.
... ... @@ -22,15 +22,30 @@
<state key="normal" title="Change Value">
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
</state>
<connections>
<action selector="changeValue:" destination="Tha-Wr-sPW" eventType="touchUpInside" id="zeG-Cp-Wjs"/>
</connections>
</button>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" misplaced="YES" text="Label" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="FUU-vZ-jMd">
<rect key="frame" x="53" y="81" width="215" height="30"/>
<fontDescription key="fontDescription" name="Avenir-Medium" family="Avenir" pointSize="23"/>
<color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
<nil key="highlightedColor"/>
</label>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
<constraints>
<constraint firstItem="FUU-vZ-jMd" firstAttribute="top" secondItem="znr-YO-4a4" secondAttribute="bottom" constant="17" id="DLv-qJ-h7R"/>
<constraint firstAttribute="centerX" secondItem="FUU-vZ-jMd" secondAttribute="centerX" id="YGT-a5-Zka"/>
<constraint firstItem="L3F-13-Wf5" firstAttribute="top" secondItem="znr-YO-4a4" secondAttribute="bottom" constant="300" id="ewm-kv-p8k"/>
<constraint firstAttribute="centerX" secondItem="L3F-13-Wf5" secondAttribute="centerX" id="zXw-WV-mro"/>
</constraints>
</view>
<navigationItem key="navigationItem" title="PNChart" id="Ukg-Sg-E2z"/>
<connections>
<outlet property="changeValueButton" destination="L3F-13-Wf5" id="JnI-y3-Xpj"/>
<outlet property="titleLabel" destination="FUU-vZ-jMd" id="dA3-KC-Ht4"/>
</connections>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="kDa-u3-t6i" userLabel="First Responder" sceneMemberID="firstResponder"/>
</objects>
... ...
... ... @@ -7,7 +7,19 @@
//
#import <UIKit/UIKit.h>
#import "PNChartDelegate.h"
#import "PNChart.h"
@interface PCChartViewController : UIViewController
@interface PCChartViewController : UIViewController<PNChartDelegate>
@property (nonatomic) PNLineChart * lineChart;
@property (nonatomic) PNBarChart * barChart;
@property (nonatomic) PNCircleChart * circleChart;
@property (nonatomic) PNPieChart *pieChart;
@property (weak, nonatomic) IBOutlet UILabel *titleLabel;
- (IBAction)changeValue:(id)sender;
@property (weak, nonatomic) IBOutlet UIButton *changeValueButton;
@end
... ...
... ... @@ -10,4 +10,189 @@
@implementation PCChartViewController
-(void)viewDidLoad
{
[super viewDidLoad];
self.titleLabel.textColor = PNFreshGreen;
if ([self.title isEqualToString:@"Line Chart"]) {
self.titleLabel.text = @"Line Chart";
self.lineChart = [[PNLineChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];
self.lineChart.yLabelFormat = @"%1.1f";
self.lineChart.backgroundColor = [UIColor clearColor];
[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];
data01.color = PNFreshGreen;
data01.itemCount = data01Array.count;
data01.inflexionPointStyle = PNLineChartPointStyleTriangle;
data01.getData = ^(NSUInteger index) {
CGFloat yValue = [data01Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
// Line Chart #2
NSArray * data02Array = @[@20.1, @180.1, @26.4, @202.2, @126.2, @167.2, @276.2];
PNLineChartData *data02 = [PNLineChartData new];
data02.color = PNTwitterColor;
data02.itemCount = data02Array.count;
data02.inflexionPointStyle = PNLineChartPointStyleSquare;
data02.getData = ^(NSUInteger index) {
CGFloat yValue = [data02Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
self.lineChart.chartData = @[data01, data02];
[self.lineChart strokeChart];
self.lineChart.delegate = self;
[self.view addSubview:self.lineChart];
}
else if ([self.title isEqualToString:@"Bar Chart"])
{
self.titleLabel.text = @"Bar Chart";
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:self.barChart];
}
else if ([self.title isEqualToString:@"Circle Chart"])
{
self.titleLabel.text = @"Circle Chart";
self.circleChart = [[PNCircleChart alloc] initWithFrame:CGRectMake(0, 80.0, SCREEN_WIDTH, 100.0)
total:@100
current:@60
clockwise:YES
shadow:YES];
self.circleChart.backgroundColor = [UIColor clearColor];
[self.circleChart setStrokeColor:PNGreen];
[self.circleChart setStrokeColorGradientStart:[UIColor blueColor]];
[self.circleChart strokeChart];
[self.view addSubview:self.circleChart];
}
else if ([self.title isEqualToString:@"Pie Chart"])
{
self.titleLabel.text = @"Pie Chart";
NSArray *items = @[[PNPieChartDataItem dataItemWithValue:10 color:PNLightGreen],
[PNPieChartDataItem dataItemWithValue:20 color:PNFreshGreen description:@"WWDC"],
[PNPieChartDataItem dataItemWithValue:40 color:PNDeepGreen description:@"GOOG I/O"],
];
self.pieChart = [[PNPieChart alloc] initWithFrame:CGRectMake(SCREEN_WIDTH /2.0 - 100, 135, 200.0, 200.0) items:items];
self.pieChart.descriptionTextColor = [UIColor whiteColor];
self.pieChart.descriptionTextFont = [UIFont fontWithName:@"Avenir-Medium" size:11.0];
self.pieChart.descriptionTextShadowColor = [UIColor clearColor];
[self.pieChart strokeChart];
[self.view addSubview:self.pieChart];
self.changeValueButton.hidden = YES;
}
}
- (void)userClickedOnLineKeyPoint:(CGPoint)point lineIndex:(NSInteger)lineIndex pointIndex:(NSInteger)pointIndex{
NSLog(@"Click Key on line %f, %f line index is %d and point index is %d",point.x, point.y,(int)lineIndex, (int)pointIndex);
}
- (void)userClickedOnLinePoint:(CGPoint)point lineIndex:(NSInteger)lineIndex{
NSLog(@"Click on line %f, %f, line index is %d",point.x, point.y, (int)lineIndex);
}
- (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];
data01.color = PNFreshGreen;
data01.itemCount = data01Array.count;
data01.inflexionPointStyle = PNLineChartPointStyleTriangle;
data01.getData = ^(NSUInteger index) {
CGFloat yValue = [data01Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
// Line Chart #2
NSArray * data02Array = @[@(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300)];
PNLineChartData *data02 = [PNLineChartData new];
data02.color = PNTwitterColor;
data02.itemCount = data02Array.count;
data02.inflexionPointStyle = PNLineChartPointStyleSquare;
data02.getData = ^(NSUInteger index) {
CGFloat yValue = [data02Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
[self.lineChart setXLabels:@[@"DEC 1",@"DEC 2",@"DEC 3",@"DEC 4",@"DEC 5",@"DEC 6",@"DEC 7"]];
[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 updateChartData:@[@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30)]];
}
else if ([self.title isEqualToString:@"Circle Chart"])
{
[self.circleChart updateChartByCurrent:@(arc4random() % 100)];
}
}
- (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
... ...
... ... @@ -7,11 +7,7 @@
//
#import <UIKit/UIKit.h>
#import "PNChartDelegate.h"
#import "PNChart.h"
@interface PCChartsTableViewController : UITableViewController<PNChartDelegate>
@property (nonatomic) PNBarChart * barChart;
@interface PCChartsTableViewController : UITableViewController
@end
... ...
... ... @@ -21,47 +21,6 @@
if ([segue.identifier isEqualToString:@"lineChart"]) {
//Add line chart
UILabel * lineChartLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 90, SCREEN_WIDTH, 30)];
lineChartLabel.text = @"Line Chart";
lineChartLabel.textColor = PNFreshGreen;
lineChartLabel.font = [UIFont fontWithName:@"Avenir-Medium" size:23.0];
lineChartLabel.textAlignment = NSTextAlignmentCenter;
PNLineChart * lineChart = [[PNLineChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];
lineChart.yLabelFormat = @"%1.1f";
lineChart.backgroundColor = [UIColor clearColor];
[lineChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5",@"SEP 6",@"SEP 7"]];
lineChart.showCoordinateAxis = YES;
// Line Chart #1
NSArray * data01Array = @[@60.1, @160.1, @126.4, @262.2, @186.2, @127.2, @176.2];
PNLineChartData *data01 = [PNLineChartData new];
data01.color = PNFreshGreen;
data01.itemCount = lineChart.xLabels.count;
data01.inflexionPointStyle = PNLineChartPointStyleTriangle;
data01.getData = ^(NSUInteger index) {
CGFloat yValue = [data01Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
// Line Chart #2
NSArray * data02Array = @[@20.1, @180.1, @26.4, @202.2, @126.2, @167.2, @276.2];
PNLineChartData *data02 = [PNLineChartData new];
data02.color = PNTwitterColor;
data02.itemCount = lineChart.xLabels.count;
data02.inflexionPointStyle = PNLineChartPointStyleSquare;
data02.getData = ^(NSUInteger index) {
CGFloat yValue = [data02Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
lineChart.chartData = @[data01, data02];
[lineChart strokeChart];
lineChart.delegate = self;
[viewController.view addSubview:lineChartLabel];
[viewController.view addSubview:lineChart];
viewController.title = @"Line Chart";
... ... @@ -69,114 +28,21 @@
{
//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"])
{
//Add circle chart
UILabel * circleChartLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 90, SCREEN_WIDTH, 30)];
circleChartLabel.text = @"Circle Chart";
circleChartLabel.textColor = PNFreshGreen;
circleChartLabel.font = [UIFont fontWithName:@"Avenir-Medium" size:23.0];
circleChartLabel.textAlignment = NSTextAlignmentCenter;
PNCircleChart * circleChart = [[PNCircleChart alloc] initWithFrame:CGRectMake(0, 80.0, SCREEN_WIDTH, 100.0)
total:@100
current:@60
clockwise:YES
shadow:YES];
circleChart.backgroundColor = [UIColor clearColor];
[circleChart setStrokeColor:PNGreen];
[circleChart setStrokeColorGradientStart:[UIColor blueColor]];
[circleChart strokeChart];
[viewController.view addSubview:circleChartLabel];
[viewController.view addSubview:circleChart];
viewController.title = @"Circle Chart";
} else if ([segue.identifier isEqualToString:@"pieChart"])
{
//Add pie chart
UILabel * pieChartLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 90, SCREEN_WIDTH, 30)];
pieChartLabel.text = @"Pie Chart";
pieChartLabel.textColor = PNFreshGreen;
pieChartLabel.font = [UIFont fontWithName:@"Avenir-Medium" size:23.0];
pieChartLabel.textAlignment = NSTextAlignmentCenter;
NSArray *items = @[[PNPieChartDataItem dataItemWithValue:10 color:PNLightGreen],
[PNPieChartDataItem dataItemWithValue:20 color:PNFreshGreen description:@"WWDC"],
[PNPieChartDataItem dataItemWithValue:40 color:PNDeepGreen description:@"GOOG I/O"],
];
PNPieChart *pieChart = [[PNPieChart alloc] initWithFrame:CGRectMake(SCREEN_WIDTH /2.0 - 100, 135, 200.0, 200.0) items:items];
pieChart.descriptionTextColor = [UIColor whiteColor];
pieChart.descriptionTextFont = [UIFont fontWithName:@"Avenir-Medium" size:11.0];
pieChart.descriptionTextShadowColor = [UIColor clearColor];
[pieChart strokeChart];
[viewController.view addSubview:pieChartLabel];
[viewController.view addSubview:pieChart];
viewController.title = @"Pie Chart";
}
}
- (void)userClickedOnLineKeyPoint:(CGPoint)point lineIndex:(NSInteger)lineIndex pointIndex:(NSInteger)pointIndex{
NSLog(@"Click Key on line %f, %f line index is %d and point index is %d",point.x, point.y,(int)lineIndex, (int)pointIndex);
}
- (void)userClickedOnLinePoint:(CGPoint)point lineIndex:(NSInteger)lineIndex{
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
... ...
... ... @@ -28,7 +28,7 @@ You will need LLVM 3.0 or later in order to build PNChart.
[CocoaPods](http://cocoapods.org) is the recommended way to add PNChart to your project.
1. Add a pod entry for PNChart to your Podfile `pod 'PNChart', '~> 0.5.5'`
1. Add a pod entry for PNChart to your Podfile `pod 'PNChart', '~> 0.6.0'`
2. Install the pod(s) by running `pod install`.
3. Include PNChart wherever you need it with `#import "PNChart.h"`.
... ... @@ -116,12 +116,54 @@ pieChart.descriptionTextFont = [UIFont fontWithName:@"Avenir-Medium" size:14.0]
[pieChart strokeChart];
```
#### Callback
#### Update Value
Currently callback only works on Linechart
Now it's easy to update value in real time
```objective-c
#import "PNChart.h"
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];
data01.color = PNFreshGreen;
data01.itemCount = data01Array.count;
data01.inflexionPointStyle = PNLineChartPointStyleTriangle;
data01.getData = ^(NSUInteger index) {
CGFloat yValue = [data01Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
// Line Chart #2
NSArray * data02Array = @[@(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300), @(arc4random() % 300)];
PNLineChartData *data02 = [PNLineChartData new];
data02.color = PNTwitterColor;
data02.itemCount = data02Array.count;
data02.inflexionPointStyle = PNLineChartPointStyleSquare;
data02.getData = ^(NSUInteger index) {
CGFloat yValue = [data02Array[index] floatValue];
return [PNLineChartDataItem dataItemWithY:yValue];
};
[self.lineChart setXLabels:@[@"DEC 1",@"DEC 2",@"DEC 3",@"DEC 4",@"DEC 5",@"DEC 6",@"DEC 7"]];
[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 updateChartData:@[@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30),@(arc4random() % 30)]];
}
else if ([self.title isEqualToString:@"Circle Chart"])
{
[self.circleChart updateChartByCurrent:@(arc4random() % 100)];
}
```
#### Callback
```objective-c
#import "PNChart.h"
//For LineChart
... ...