设为首页 加入收藏

TOP

iOS 折线图、柱状图的简单实现(一)
2019-08-31 00:20:02 】 浏览:82
Tags:iOS 线图 柱状 简单 实现

首先我得感谢某位博主,非常抱歉,因为之前直接下载博主提供这篇文章的demo,然后去研究了,没记住博主的名字。再次非常感谢。

而这个dome我又修改了一些,完善了一些不美观的bug,当然还有,后面会陆续更新。

1 、一开始需要给坐标轴初始一个画布

//初始化画布
+(instancetype)initWithFrame:(CGRect)frame{
    //找到名称叫BezierCurveView的xib视图
    BezierCurveView *bezierCurveView = [[NSBundle mainBundle] loadNibNamed:@"BezierCurveView" owner:self options:nil].lastObject;
    bezierCurveView.frame = frame;
    
    //背景视图
    UIView *backView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height)];
    backView.backgroundColor = XYQColor(255, 229, 239);
    [bezierCurveView addSubview:backView];
    
    myFrame = frame;
    return bezierCurveView;
}

2、然后画坐标轴,包括x、y轴的直线、箭头、字符串的索引、路径的渲染。

/**
 *  画坐标轴
 */
-(void)drawXYLine:(NSMutableArray *)x_names Adddistanceva lues:(NSInteger )adddistance StartingValues:(NSInteger)starting ProportionValuess:(NSInteger)proportion{
    
    UIBezierPath *path = [UIBezierPath bezierPath];
    
    //1.Y轴、X轴的直线
    [path moveToPoint:CGPointMake(MARGIN+adddistance, CGRectGetHeight(myFrame)-MARGIN)];
    [path addLineToPoint:CGPointMake(MARGIN+adddistance, MARGIN)];
    
    [path moveToPoint:CGPointMake(MARGIN+adddistance, CGRectGetHeight(myFrame)-MARGIN)];
    [path addLineToPoint:CGPointMake(MARGIN+CGRectGetWidth(myFrame)-2*MARGIN+adddistance, CGRectGetHeight(myFrame)-MARGIN)];
    
    //2.添加箭头
    [path moveToPoint:CGPointMake(MARGIN+adddistance, MARGIN)];
    [path addLineToPoint:CGPointMake(MARGIN-5+adddistance, MARGIN+5)];
    [path moveToPoint:CGPointMake(MARGIN+adddistance, MARGIN)];
    [path addLineToPoint:CGPointMake(MARGIN+5+adddistance, MARGIN+5)];
    
    [path moveToPoint:CGPointMake(MARGIN+CGRectGetWidth(myFrame)-2*MARGIN+adddistance, CGRectGetHeight(myFrame)-MARGIN)];
    [path addLineToPoint:CGPointMake(MARGIN+CGRectGetWidth(myFrame)-2*MARGIN-5+adddistance, CGRectGetHeight(myFrame)-MARGIN-5)];
    [path moveToPoint:CGPointMake(MARGIN+CGRectGetWidth(myFrame)-2*MARGIN+adddistance, CGRectGetHeight(myFrame)-MARGIN)];
    [path addLineToPoint:CGPointMake(MARGIN+CGRectGetWidth(myFrame)-2*MARGIN-5+adddistance, CGRectGetHeight(myFrame)-MARGIN+5)];

    //3.添加索引格
    //X轴
    for (int i=0; i<x_names.count; i++) {
        CGFloat X = MARGIN + MARGIN*(i+1);
        CGPoint point = CGPointMake(X+adddistance,CGRectGetHeight(myFrame)-MARGIN);
        [path moveToPoint:point];
        [path addLineToPoint:CGPointMake(point.x, point.y-3)];
    }
    //Y轴(实际长度为200,此处比例缩小一倍使用)
    for (int i=0; i<11; i++) {
        CGFloat Y = CGRectGetHeight(myFrame)-MARGIN-Y_EVERY_MARGIN*i;
        CGPoint point = CGPointMake(MARGIN+adddistance,Y);
        [path moveToPoint:point];
        [path addLineToPoint:CGPointMake(point.x+3, point.y)];
    }
    
    //4.添加索引格文字
    //X轴
    for (int i=0; i<x_names.count+1; i++) {
        CGFloat X = MARGIN + 15 + MARGIN*i;
        UILabel *textLabel = [[UILabel alloc] initWithFrame:CGRectMake(X+adddistance, CGRectGetHeight(myFrame)-MARGIN, MARGIN, 20)];
        if(i < x_names.count){
            textLabel.text = x_names[i];
        }
        else{
            textLabel.text = @"年/月";
        }
        textLabel.font = [UIFont systemFontOfSize:10];
        textLabel.textAlignment = NSTextAlignmentCenter;
        textLabel.textColor = [UIColor blueColor];
        [self addSubview:textLabel];
        
    }
    
    //Y轴
    for (int i=0; i<11; i++) {
        CGFloat Y = CGRectGetHe
首页 上一页 1 2 3 4 下一页 尾页 1/4/4
】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
上一篇iOS 判断两个颜色是否相同 下一篇OpenGL ES 渲染立体图形

最新文章

热门文章

Hot 文章

Python

C 语言

C++基础

大数据基础

linux编程基础

C/C++面试题目