iOS图表绘制 - YMGraphView

最新推荐文章于 2024-01-25 10:21:34 发布

MLusrrt

最新推荐文章于 2024-01-25 10:21:34 发布

阅读量557

点赞数

分类专栏： iOS 文章标签： ios

本文链接：https://blog.csdn.net/djcxym/article/details/52032995

版权

iOS 专栏收录该内容

2 篇文章

订阅专栏

YMGraphView用于图表绘制，可作散点图，饼图，柱状图，折线图等。可以自动处理坐标问题，只需将所需作图的点封装进数组即可。

项目源代码地址：https://github.com/djcxym/YMGraphView

画图类型通过枚举指定

typedef NS_ENUM(NSInteger,YMGraphViewStyle)
{
YMGraphViewStyleScatter,    //散点图
YMGraphViewStylePie,        //饼状图
YMGraphViewStyleHist,       //柱状图
YMGraphViewStyleLine,       //单条折线图
YMGraphViewStyleAnnular,    //环状图
YMGraphViewStyleMultiLine   //多条折线图
};

一、散点图

//随机画200个点
NSMutableArray *scatterArr = [[NSMutableArray alloc]init];
for (int i=0; i<200; i++) {
    CGFloat x = arc4random()%1000;
    CGFloat y = arc4random()%500;
    [scatterArr addObject:[NSValue valueWithCGPoint:CGPointMake(x, y)]];
}
YMGraphView *view = [[YMGraphView alloc]initWithFrame:_rect data:scatterArr preferedStyle:YMGraphViewStyleScatter];
[self.view addSubview:view];

散点图

二、饼状图

YMGraphView *view = [[YMGraphView alloc]initWithFrame:_rect data:@[@400,@300,@700,@400,@400,@600] preferedStyle:YMGraphViewStylePie];
[self.view addSubview:view];

[view setPieStickOutIndex:3];

饼图-突出显示

三、柱状图

YMGraphView *view = [[YMGraphView alloc]initWithFrame:_rect data:@[@400,@300,@700,@400,@400,@600] preferedStyle:YMGraphViewStyleHist];
[self.view addSubview:view];

柱状图

四、折线图

YMGraphView *view = [[YMGraphView alloc]initWithFrame:_rect
                               data:@[[NSValue valueWithCGPoint:CGPointMake(2, 200)],
                                     [NSValue valueWithCGPoint:CGPointMake(-7, 900)],
                                     [NSValue valueWithCGPoint:CGPointMake(-3, 700)],
                                     [NSValue valueWithCGPoint:CGPointMake(8, 1700)],
                                     [NSValue valueWithCGPoint:CGPointMake(1, 500)]]
                               preferedStyle:YMGraphViewStyleLine];
[self.view addSubview:view];

折线图

五、多条折线

YMGraphView *view = [[YMGraphView alloc]initWithFrame:_rect
        data:@[@[[NSValue valueWithCGPoint:CGPointMake(2, 200)],
                 [NSValue valueWithCGPoint:CGPointMake(7, 900)],
                 [NSValue valueWithCGPoint:CGPointMake(3, 700)],
                 [NSValue valueWithCGPoint:CGPointMake(8, 1200)],
                 [NSValue valueWithCGPoint:CGPointMake(1, 500)]],
                @[[NSValue valueWithCGPoint:CGPointMake(3, 800)],
                 [NSValue valueWithCGPoint:CGPointMake(6, 1200)],
                 [NSValue valueWithCGPoint:CGPointMake(4, 800)],
                 [NSValue valueWithCGPoint:CGPointMake(9, 1500)],
                 [NSValue valueWithCGPoint:CGPointMake(2, 500)]],
                @[[NSValue valueWithCGPoint:CGPointMake(2, 1400)],
                 [NSValue valueWithCGPoint:CGPointMake(6, 1900)],
                 [NSValue valueWithCGPoint:CGPointMake(5, 1400)],
                 [NSValue valueWithCGPoint:CGPointMake(10, 1000)],
                 [NSValue valueWithCGPoint:CGPointMake(1, 1200)]]]
        preferedStyle:YMGraphViewStyleMultiLine];

[self.view addSubview:view];

多条折线

[view setShowGrid:NO];
[view setShowPoint:NO];

不显示网格

六、画函数

YMGraphView *view = [YMGraphView drawFuncWithBlock:^(CGFloat x){
        return fabs(x) - fabs(x/2 + 1) - fabs(x/2 - 1) + (fabs(x/2 + 2) + fabs(x/2 - 2) - fabs(x/2 + 1) - fabs(x/2 - 1))*sin(5*M_PI*x);
    }from:-5 to:5 withFrame:_rect];
[self.view addSubview:view];