屏幕快照 2017-04-06 17.17.02.png
从开始使用初始化说起
首先初始化个LineGraph视图，赋值XY轴数组，XY轴的最大值，XY轴的颜色，每条折线所代表的意思放置位置（代码中为upleft）
LineGraph* lineGraphView = [[LineGraph alloc]initWithFrame:CGRectMake(20, 100, 300, 200)];
lineGraphView.XArray = @[@"0",@"1",@"2",@"3",@"4",@"5",@"6",@"7",@"8",@"9",@"10"];
lineGraphView.YArray = @[@"0",@"0.3",@"0.4",@"0.6",@"0.8",@"1.0"];
lineGraphView.MaxX = 10.0f;
lineGraphView.MaxY = 1.0f;
lineGraphView.XYlineColor = [UIColor redColor];
lineGraphView.namePosition = LineNamePositionUpleft;
lineGraphView.layer.borderWidth = 1;
[self.view addSubview:lineGraphView];
这一段相较于之前没做多大改变，添加了折线信息的位置设置
typedef NS_ENUM(NSUInteger, LineNamePosition) {
LineNamePositionUpleft, //折线对应的名称在左上
LineNamePositionUpRight, //折线对应的名称在右上
LineNamePositionCenter, //折线对应的名称在中上
};
之后对折线进行封装，每一条直线都是一个BrokenLine的实例
BrokenLine* bkLin = [BrokenLine new];
bkLin.lineColor = [UIColor greenColor];
bkLin.lineName = @"测试1";
bkLin.brokenArray = @[[NSValue valueWithCGPoint:CGPointMake(0, 0.7)],[NSValue valueWithCGPoint:CGPointMake(1.3, 0.3)],[NSValue valueWithCGPoint:CGPointMake(1.7, 0.5)],[NSValue valueWithCGPoint:CGPointMake(1.9, 0.8)],[NSValue valueWithCGPoint:CGPointMake(2.4, 0.3)],[NSValue valueWithCGPoint:CGPointMake(3.3, 0.44)],[NSValue valueWithCGPoint:CGPointMake(3.9, 0.3)]];
[lineGraphView addBrokenLine:bkLin];
实例中对折线的颜色，名字及折线中点的数值进行赋值，并添加在lineGraphView上，add方法为以下：
-(void)addBrokenLine:(BrokenLine*)bkLin
{
[self.totalBrokenArray addObject:bkLin];
bkLin.brokenArray = [bkLin drawBrokenLine:self.frame andMaxX:_MaxX andMaxY:_MaxY];
}
BrokenLine类
@interface BrokenLine : NSObject
@property (nonatomic, assign) UIColor* lineColor; //折线颜色
@property (nonatomic, strong) NSArray* brokenArray; //传入的point数组
@property (nonatomic, strong) NSString* lineName; //该折线对应的名称
-(NSMutableArray*)drawBrokenLine:(CGRect)lineFrame andMaxX:(CGFloat)maxX andMaxY:(CGFloat)maxY;
@end
@implementation BrokenLine
-(NSMutableArray*)drawBrokenLine:(CGRect)lineFrame andMaxX:(CGFloat)maxX andMaxY:(CGFloat)maxY
{
NSMutableArray* positionArr = [NSMutableArray new];
for (int i = 0; i<self.brokenArray.count; i++) {
NSValue* valueStart = self.brokenArray[i];
CGPoint pointStart = [valueStart CGPointValue];
CGPoint p = CGPointMake((pointStart.x/maxX)*(lineFrame.size.width-2*defaultX), (pointStart.y/maxY)*(lineFrame.size.height-2*defalutY));
if (i == 0) {
[positionArr addObject:[NSValue valueWithCGPoint:CGPointMake(p.x+defaultX,lineFrame.size.height-p.y-defalutY)]];
}
else
{
//把点加入到路径里面
[positionArr addObject:[NSValue valueWithCGPoint:CGPointMake(p.x+defaultX,lineFrame.size.height-p.y-defalutY)]];
}
}
return positionArr;
}
@end
drawBrokenLine这个方法中计算出传入的点相对于XY轴坐标系的真正位置，返回给自身的brokenArray，之后可以在LineGraph的totalBrokenArray数组中获取
画折线的时机放在了画完XY轴虚线之后
在
-(void)drawVirtualLine:(UILabel*)lab andStartPt:(CGPoint)pStart andEndPt:(CGPoint)pEnd
下添加
for (int i = 0; i < self.totalBrokenArray.count; i++) {
BrokenLine* bkLin = self.totalBrokenArray[i];
[self drawBrokenLine:self.frame andMaxX:_MaxX andMaxY:_MaxY andBkLin:bkLin andptArr:[bkLin drawBrokenLine:self.frame andMaxX:_MaxX andMaxY:_MaxY]];
}
-(void)drawBrokenLine:(CGRect)lineFrame andMaxX:(CGFloat)maxX andMaxY:(CGFloat)maxY
andBkLin:(BrokenLine*)bkLin andptArr:(NSMutableArray*)ptArr
{
CGContextRef context = UIGraphicsGetCurrentContext();
//创建贝塞尔曲线对象
UIBezierPath *currenPath = [UIBezierPath bezierPath];
currenPath.lineCapStyle = kCGLineCapRound;//拐弯处为弧线
currenPath.lineJoinStyle = kCGLineCapRound;
currenPath.lineWidth = 0.3f;
UIColor *color = bkLin.lineColor;
[color set];
CGFloat lengths[] = {10,0};
CGContextSetLineDash(context, 0, lengths,2);
for (int i = 0; i<bkLin.brokenArray.count; i++) {
NSValue* valueStart = bkLin.brokenArray[i];
CGPoint pointStart = [valueStart CGPointValue];
if (i == 0) {
[currenPath moveToPoint:CGPointMake(pointStart.x,pointStart.y)];
}
else
{
//把点加入到路径里面
[currenPath addLineToPoint:CGPointMake(pointStart.x,pointStart.y)];
}
}
//画线
[currenPath stroke];
}
对了，忘记说那个每条折线所代表的意思放置位置。
用xib画成这样
屏幕快照 2017-04-06 17.11.41.png
LineNameView类的实现如下....并没多少实现其实
@interface LineNameView : UIView
@property (nonatomic, strong) IBOutlet UIView* colorView;
@property (nonatomic, strong) IBOutlet UILabel* nameLab;
+ (instancetype)viewFromNIB;
@end
@implementation LineNameView
// Convenience Method
+ (instancetype)viewFromNIB {
NSArray *views = [[NSBundle mainBundle] loadNibNamed:NSStringFromClass([self class]) owner:nil options:nil];
return views[0];
}
- (void)awakeFromNib {
[super awakeFromNib];
}
@end
完成上述之后可以对其进行初始化，根据NSEUM计算出放置的位置
-(void)drawLineName
{
for (int i = 0; i < self.totalBrokenArray.count; i++) {
BrokenLine* bkLin = self.totalBrokenArray[i];
LineNameView* nameView = [LineNameView viewFromNIB];
nameView.colorView.backgroundColor = bkLin.lineColor;
nameView.nameLab.text = bkLin.lineName;
[self addSubview:nameView];
switch (self.namePosition) {
case LineNamePositionUpleft:
nameView.frame = CGRectMake(defaultX+NameWidth*i, 0, NameWidth, defalutY);
break;
case LineNamePositionUpRight:
nameView.frame = CGRectMake(defaultX+NameWidth*i, 0, NameWidth, defalutY);
break;
case LineNamePositionCenter:
nameView.frame = CGRectMake(defaultX+NameWidth*i, 0, NameWidth, defalutY);
break;
default:
break;
}
}
}
