iOS画折线图

代码例子效果：  下载地址：http://download.csdn.net/detail/qqmcy/6983187

LineChartViewDemo.h

1. #import <UIKit/UIKit.h>
2. @interface LineChartViewDemo : UIView
3. //横竖轴距离间隔
4. @property (assign) NSInteger hInterval;
5. @property (assign) NSInteger vInterval;
6. //横竖轴显示标签
7. @property (nonatomic, strong) NSArray *hDesc;
8. @property (nonatomic, strong) NSArray *vDesc;
9. //点信息
10. @property (nonatomic, strong) NSArray *array;
11. @property (nonatomic, strong) NSArray* array1;
12. @end

LineChartViewDemo.m

1. #import "LineChartViewDemo.h"
2. #import "EColumnChartLabel.h"
3. #define KlineHeight 30
4. @interface LineChartViewDemo()
5. {
6. CALayer *linesLayer;
7. UIView *popView;
8. UILabel *disLabel;
9. int x;
10. int y;
11. }
12. @end
13. @implementation LineChartViewDemo
14. - (id)initWithFrame:(CGRect)frame
15. {
16. self = [super initWithFrame:frame];
17. if (self) {
18. // Initialization code
19. self.backgroundColor = [UIColor clearColor];
20. x = frame.size.width;
21. y = frame.size.height;
22. _hInterval = 10;
23. _vInterval = 50;
24. linesLayer = [[CALayer alloc] init];
25. linesLayer.masksToBounds = YES;
26. linesLayer.contentsGravity = kCAGravityLeft;
27. linesLayer.backgroundColor = [[UIColor redColor] CGColor];
28. //[self.layer addSublayer:linesLayer];
29. //PopView
30. popView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 60, 30)];
31. [popView setBackgroundColor:[UIColor whiteColor]];
32. [popView setAlpha:0.0f];
33. disLabel = [[UILabel alloc]initWithFrame:popView.frame];
34. [disLabel setTextAlignment:NSTextAlignmentCenter];
35. [popView addSubview:disLabel];
36. [self addSubview:popView];
37. }
38. return self;
39. }
40. // Only override drawRect: if you perform custom drawing.
41. // An empty implementation adversely affects performance during animation.
42. - (void)drawRect:(CGRect)rect
43. {
44. [self setClearsContextBeforeDrawing: YES];
45. CGContextRef context = UIGraphicsGetCurrentContext();
46. //画背景线条------------------
47. CGColorRef backColorRef = [UIColor redColor].CGColor;
48. CGFloat backLineWidth = 0.5f;
49. CGFloat backMiterLimit = 0.f;
50. CGContextSetLineWidth(context, backLineWidth);//主线宽度
51. // CGContextSetMiterLimit(context, backMiterLimit);//投影角度
52. //CGContextSetShadowWithColor(context, CGSizeMake(3, 5), 8, backColorRef);//设置双条线
53. CGContextSetLineJoin(context, kCGLineJoinRound);
54. CGContextSetLineCap(context, kCGLineCapRound );
55. CGContextSetBlendMode(context, kCGBlendModeNormal);
56. CGContextSetStrokeColorWithColor(context, [UIColor grayColor].CGColor);
57. // CGContextSetStrokeColorWithColor(context, [UIColor colorWithRed:225.0f / 255.0f green:225.0f / 255.0f blue:225.0f / 255.0f alpha:1.0].CGColor);
58. //    int x = 400 ;
59. //    //Y轴横线
60. //    int y = 300 ;
61. int tempY = y;
62. //添加纵轴标签和线
63. for (int i=0; i<_vDesc.count; i++) {
64. CGPoint bPoint = CGPointMake(30, tempY);
65. CGPoint ePoint = CGPointMake(x, tempY);
66. EColumnChartLabel *label = [[EColumnChartLabel alloc]initWithFrame:CGRectMake(0, 0, 30, 30)];
67. [label setCenter:CGPointMake(bPoint.x-15, bPoint.y-30)];
68. [label setTextAlignment:NSTextAlignmentCenter];
69. [label setBackgroundColor:[UIColor clearColor]];
70. [label setTextColor:[UIColor blackColor]];
71. [label setText:[_vDesc objectAtIndex:i]];
72. [self addSubview:label];
73. CGContextMoveToPoint(context, bPoint.x, bPoint.y-30);
74. CGContextAddLineToPoint(context, ePoint.x, ePoint.y-30);
75. tempY -= y * 0.1;
76. }
77. for (int i=0; i<_array.count-1; i++) {
78. EColumnChartLabel *label = [[EColumnChartLabel alloc]initWithFrame:CGRectMake(i*KlineHeight+30, y - 30, 40, 30)];
79. [label setTextAlignment:NSTextAlignmentCenter];
80. [label setBackgroundColor:[UIColor clearColor]];
81. [label setTextColor:[UIColor redColor]];
82. label.numberOfLines = 1;
83. label.adjustsFontSizeToFitWidth = YES;
84. label . minimumFontSize = 1.0f;
85. [label setText:[_hDesc objectAtIndex:i]];
86. [self addSubview:label];
87. }
88. CGContextStrokePath(context);
89. //    //画点线条------------------
90. CGColorRef pointColorRef = [UIColor colorWithRed:24.0f/255.0f green:116.0f/255.0f blue:205.0f/255.0f alpha:1.0].CGColor;
91. CGFloat pointLineWidth = 1.5f;
92. CGFloat pointMiterLimit = 5.0f;
93. CGContextSetLineWidth(context, pointLineWidth);//主线宽度
94. CGContextSetMiterLimit(context, pointMiterLimit);//投影角度
95. //CGContextSetShadowWithColor(context, CGSizeMake(3, 5), 8, pointColorRef);//设置双条线
96. CGContextSetLineJoin(context, kCGLineJoinRound);
97. CGContextSetLineCap(context, kCGLineCapRound );
98. CGContextSetBlendMode(context, kCGBlendModeNormal);
99. //CGContextSetStrokeColorWithColor(context, [UIColor blueColor].CGColor);
100. UIColor* color1 = c_BeforeLastYear;
101. [color1 set];
102. //绘图
103. CGPoint p1 = [[_array objectAtIndex:0] CGPointValue];
104. int i = 0;
105. //获取视图的高
106. int tempY1 = y;
107. int tempWidth = y * 0.1f;
108. float tempHeight = y * (270.0 / 320.0);
109. float tempHeight1 = y * (20.0f / 320.0f);
110. //   NSLog(@"%f");
111. CGContextMoveToPoint(context, p1.x + 20, tempHeight-p1.y*tempWidth/tempHeight1);
112. for (; i<[_array count]; i++)
113. {
114. p1 = [[_array objectAtIndex:i] CGPointValue];
115. CGPoint goPoint = CGPointMake(p1.x + 20, tempHeight-p1.y*tempWidth/tempHeight1);
116. CGContextAddLineToPoint(context, goPoint.x, goPoint.y);;
117. //添加触摸点
118. UIButton *bt = [UIButton buttonWithType:UIButtonTypeCustom];
119. [bt setBackgroundColor:[UIColor redColor]];
120. [bt setFrame:CGRectMake(0, 0, 10, 10)];
121. [bt setCenter:goPoint];
122. [bt addTarget:self
123. action:@selector(btAction:)
124. forControlEvents:UIControlEventTouchUpInside];
125. [self addSubview:bt];
126. }
127. CGContextStrokePath(context);
128. // CGContextSetStrokeColorWithColor(context, [UIColor greenColor].CGColor);
129. UIColor* color = c_LastYear;
130. [color set];
131. //绘图
132. p1 = [[_array1 objectAtIndex:0] CGPointValue];
133. i = 0;
134. CGContextMoveToPoint(context, p1.x + 20, tempHeight-p1.y*tempWidth/tempHeight1);
135. for (; i<[_array1 count]; i++)
136. {
137. p1 = [[_array1 objectAtIndex:i] CGPointValue];
138. CGPoint goPoint = CGPointMake(p1.x + 20, tempHeight-p1.y*tempWidth/tempHeight1);
139. CGContextAddLineToPoint(context, goPoint.x, goPoint.y);;
140. //添加触摸点
141. UIButton *bt = [UIButton buttonWithType:UIButtonTypeCustom];
142. [bt setBackgroundColor:[UIColor redColor]];
143. [bt setFrame:CGRectMake(0, 0, 10, 10)];
144. [bt setCenter:goPoint];
145. [bt addTarget:self
146. action:@selector(btAction:)
147. forControlEvents:UIControlEventTouchUpInside];
148. [self addSubview:bt];
149. }
150. CGContextStrokePath(context);
151. }
152. - (void)btAction:(id)sender{
153. [disLabel setText:@"400"];
154. UIButton *bt = (UIButton*)sender;
155. popView.center = CGPointMake(bt.center.x, bt.center.y - popView.frame.size.height/2);
156. [popView setAlpha:1.0f];
157. }

ViewController.m

1. #import "LineChartViewDemo.h"
2. #define CC_DEGREES_TO_RADIANS(__ANGLE__) ((__ANGLE__) * 0.01745329252f)
3. #define KlineHeight 20
4. #define KlineWidth 30
5. @interface ViewController ()
6. @end
7. @implementation ViewController
8. - (void)viewDidLoad
9. {
10. [super viewDidLoad];
11. // Do any additional setup after loading the view, typically from a nib.
12. LineChartViewDemo* line = [[LineChartViewDemo alloc] initWithFrame:CGRectMake(0, 0, 548, 250)];
13. // line.layer.transform =  CATransform3DMakeRotation(CC_DEGREES_TO_RADIANS(90), 0, 0, 1);
14. NSMutableArray *pointArr = [[NSMutableArray alloc]init];
15. //生成随机点   1
16. //[pointArr addObject:[NSValue valueWithCGPoint:CGPointMake(KlineWidth*0, 0)]];
17. for (int i = 0; i < 12; i++) {
18. [pointArr addObject:[NSValue valueWithCGPoint:CGPointMake(KlineWidth* (i+1), 55 * i)]];
19. }
20. NSMutableArray* pointArr2 = [NSMutableArray array];
21. //生成随机点   2
22. for (int i = 0; i < 12; i++) {
23. [pointArr2 addObject:[NSValue valueWithCGPoint:CGPointMake(KlineWidth* (i + 1), 110 * i)]];
24. }
25. //竖轴
26. NSMutableArray *vArr = [[NSMutableArray alloc]initWithCapacity:pointArr.count-1];
27. for (int i=0; i<9; i++) {
28. [vArr addObject:[NSString stringWithFormat:@"%d",i*20]];
29. }
30. //横轴
31. NSMutableArray *hArr = [[NSMutableArray alloc]initWithCapacity:pointArr.count-1];
32. for (int i = 1; i <= 12; i++) {
33. [hArr addObject:[NSString stringWithFormat:@"%d",i]];
34. }
35. [line setHDesc:hArr];
36. [line setVDesc:vArr];
37. [line setArray:pointArr];
38. [line setArray1:pointArr2];
39. [self.view addSubview:line];
40. }