iOS 折线图(1)
2017-03-23 本文已影响142人
马大俊不是啥好人
新建一个基于UIView的类
//
// LineGraph.h
// LineChart
//
// Created by 马家俊 on 17/3/20.
// Copyright © 2017年 MJJ. All rights reserved.
//
#import <UIKit/UIKit.h>
@interface LineGraph : UIView
@property (nonatomic, strong) NSArray* pointArray; //传入的point数组
@property (nonatomic, strong) NSArray* XArray; //传入的X轴数据数组
@property (nonatomic, strong) NSArray* YArray; //传入的Y轴数据数组
@property (nonatomic, assign) CGFloat MaxX; //X轴最大值
@property (nonatomic, assign) CGFloat MaxY; //Y轴最大值
@property (nonatomic, assign) UIColor* lineColor; //线条颜色
@property (nonatomic, strong) NSString* xUnit; //X轴单位
@property (nonatomic, strong) NSString* yUnit; //Y轴单位
@end
#import "LineGraph.h"
#define defaultX 18
#define defalutY 18
@implementation LineGraph
-(instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
self.backgroundColor = [UIColor whiteColor];
}
return self;
}
在drawRect方法中绘制折线图的XY轴
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
// Drawing code
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(context, 1.0);
CGContextSetStrokeColorWithColor(context,[UIColor redColor].CGColor);
CGContextMoveToPoint(context, defaultX, defalutY);
CGContextAddLineToPoint(context, defaultX, rect.size.height - defalutY);
CGContextAddLineToPoint(context,rect.size.width - defaultX, rect.size.height - defalutY);
CGContextStrokePath(context);
}
添加XY轴的数据及虚线
-(void)drawXYAndVirtualLine
{
CGContextRef context = UIGraphicsGetCurrentContext();
for (int i = 0; i<self.XArray.count; i++) {
CGFloat width = (self.frame.size.width - defaultX*2)/self.XArray.count;
UILabel * xLab = [[UILabel alloc]initWithFrame:CGRectMake(width*i+defaultX,self.frame.size.height-defalutY,width,defalutY)];
xLab.text = self.XArray[i];
xLab.textColor = [UIColor blackColor];
xLab.font = [UIFont systemFontOfSize:10];
[self addSubview:xLab];
if (i!=0) {
// 设置线条的样式
CGContextSetLineCap(context, kCGLineCapRound);
// 绘制线的宽度
CGContextSetLineWidth(context, 1.0);
// 线的颜色
CGContextSetStrokeColorWithColor(context, [UIColor grayColor].CGColor);
// 开始绘制
CGContextBeginPath(context);
// 设置虚线绘制起点
CGContextMoveToPoint(context, xLab.frame.origin.x, self.frame.size.height-defalutY);
// lengths的值{10,10}表示先绘制10个点,再跳过10个点,如此反复
CGFloat lengths[] = {5,5};
// 虚线的起始点
CGContextSetLineDash(context, 0, lengths,2);
// 绘制虚线的终点
NSLog(@"%lf",self.frame.size.height);
CGContextAddLineToPoint(context, xLab.frame.origin.x,defalutY);
// 绘制
CGContextStrokePath(context);
}
}
//绘制Y轴
for (int i = 0; i<self.YArray.count; i++) {
CGFloat width = (self.frame.size.height - defalutY*2)/self.XArray.count;
UILabel * xLab = [[UILabel alloc]initWithFrame:CGRectMake(0,self.frame.size.height-defalutY*2-width*i,width,defalutY)];
xLab.text = self.YArray[i];
xLab.textColor = [UIColor blackColor];
xLab.font = [UIFont systemFontOfSize:10];
[self addSubview:xLab];
}
}
下班下班,回头再说,先这样....
屏幕快照 2017-03-23 17.29.31 1.png