利用Core Plot绘制饼状图

coreplot是一个图表的第三方库,这里介绍下如何绘制饼状图

我这里通过cocoapods进行安装,具体安装方法略过

图表的层级是这样的,表格放在表格容器上,表格容器加在UIView 上

所以我们首先要创建一个表格容器

    //创建表格容器
    self.pieChartView = [[CPTGraphHostingView alloc] initWithFrame:self.view.frame];
    [self.view addSubview:self.pieChartView];
    //绘制表格
    [self createView];

接下来进行表格的绘制,我们绘制的饼状图设置了以下几个元素:坐标轴、主题、渐变图层、饼状图半径、标示符、起始角度、起始方向、边框线、标注和图表的距离,代码如下

-(void)createView
{
    //坐标轴
    CPTXYGraph *newGraph = [[CPTXYGraph alloc] initWithFrame:CGRectZero];
    //主题
    CPTTheme *theme = [CPTTheme themeNamed:kCPTDarkGradientTheme];
    //应用主题
    [newGraph applyTheme:theme];
    //添加坐标轴
    self.pieChartView.hostedGraph = newGraph;
    
    newGraph.plotAreaFrame.masksToBorder = NO;
    
    ///渐变
    CPTGradient *overlayGradient = [[CPTGradient alloc] init];
    overlayGradient.gradientType = CPTGradientTypeRadial;
    overlayGradient              = [overlayGradient addColorStop:[[CPTColor blackColor] colorWithAlphaComponent:CPTFloat(0.0)] atPosition:CPTFloat(0.0)];
    overlayGradient              = [overlayGradient addColorStop:[[CPTColor blackColor] colorWithAlphaComponent:CPTFloat(0.3)] atPosition:CPTFloat(0.9)];
    overlayGradient              = [overlayGradient addColorStop:[[CPTColor blackColor] colorWithAlphaComponent:CPTFloat(0.7)] atPosition:CPTFloat(1.0)];
    
    //饼状图
    CPTPieChart *newPlot = [[CPTPieChart alloc] init];
    newPlot.dataSource = self;
    //半径
    newPlot.pieRadius = 200.0f;
    //标示符
    newPlot.identifier = @"1";
    //起始角度
    newPlot.startAngle = CPTFloat(M_PI_2);
    //起始方向
    newPlot.sliceDirection = CPTPieDirectionCounterClockwise;
    //边框线
    newPlot.borderLineStyle = [CPTLineStyle lineStyle];
    //label 距离图表的距离
    newPlot.labelOffset = 5.0;
    //添加渐变覆盖层
    newPlot.overlayFill = [CPTFill fillWithGradient:overlayGradient];
    [newGraph addPlot:newPlot];
    
    //设置数据源
    self.dataForChart = @[@1,@2,@3,@4,@5];
}

这里的主题是个枚举值,是三方库里设置好的,我们也可以自定义主题,通过自定义CPTheme来实现

接下来就是表格的数据源方法

这里实现了四个方法

-(NSUInteger)numberOfRecordsForPlot:(CPTPlot *)plot
{
    //返回图表里面有几个点
    return self.dataForChart.count;
}
-(id)numberForPlot:(CPTPlot *)plot field:(NSUInteger)fieldEnum recordIndex:(NSUInteger)idx
{
    //返回每个点所占的比例
    NSNumber *num = nil;
    if (idx >= [self.dataForChart count]) {
        return nil;
    }
    if (fieldEnum == CPTPieChartFieldSliceWidth) {
        num = (self.dataForChart)[idx];
    }else{
        num = @(idx);
    }
    return num;
}
-(CPTLayer *)dataLabelForPlot:(CPTPlot *)plot recordIndex:(NSUInteger)idx
{
    //设置该点所对应的标注
    static CPTMutableTextStyle *whiteText = nil;
    static dispatch_once_t onceToken = 0;
    dispatch_once(&onceToken, ^{
        whiteText = [[CPTMutableTextStyle alloc] init];
        whiteText.color = [CPTColor whiteColor];
    });
    
    CPTTextLayer *newLayer = nil;
    newLayer = [[CPTTextLayer alloc] initWithText:[NSString stringWithFormat:@"%lu",(unsigned long)idx] style:whiteText];
    return newLayer;
}
-(CGFloat)radialOffsetForPieChart:(CPTPieChart*)piePlot recordIndex:(NSUInteger)index{
    
    //设置某一个分饼远离其他分饼
    return (index==1?10:0);
    
}
最后完成图如下
利用Core Plot绘制饼状图_第1张图片


有一个问题,就是不知道如何特定设置每个分饼的颜色,不知道哪位知道的话,能在下面评论教下我,谢谢

你可能感兴趣的:(iOS)