效果图先上:
前言:
需求是要出一个数据分析的饼状形数据分析,然后找了N多demo。最后发现charts的效果比其他的都要更强势一些,更优美一些,所以就选择了这个框架 Charts的git地址链接
感受:
这玩意是个折磨人的小妖精,中间反复就不多提了直接说问题和注意事项:
xcode10.0 下操作
第一步:集成charts,这里放上:参考地址链接,遇到问题的再补充一下
这里要提一下目录千万不要错了,如果错了就gg
然后继续
因为项目是OC,而Charts是swift写的,所以要桥接文件
在桥接文件里面写上 @importCharts;
第二步:配置搞好了那么就开始写代码
在你所需使用的vc里导入链接文件
写属性
#define BgColor [UIColor colorWithRed:230/255.0f green:253/255.0f blue:253/255.0f alpha:1]#define kScreenWidth [UIScreen mainScreen].bounds.size.width#define kScreenHeight [UIScreen mainScreen].bounds.size.height
@property (nonatomic, strong) PieChartView *pieChartView;
@property (nonatomic, strong) PieChartData *data;
设置饼状图
-(void)creasePieChartView{
self.pieChartView = [[PieChartView alloc] init];
self.pieChartView.backgroundColor = BgColor;
[self.view addSubview:self.pieChartView];
[self.pieChartView mas_makeConstraints:^(MASConstraintMaker *make) {
make.size.mas_equalTo(CGSizeMake(kScreenWidth, 200));
make.top.equalTo(104);
make.left.equalTo(0);
}];
[self.pieChartView setExtraOffsetsWithLeft:5 top:10 right:70 bottom:5];//饼状图距离边缘的间隙
self.pieChartView.usePercentValuesEnabled = YES;//是否根据所提供的数据, 将显示数据转换为百分比格式
self.pieChartView.dragDecelerationEnabled = YES;//拖拽饼状图后是否有惯性效果
self.pieChartView.drawSlicesUnderHoleEnabled= NO;//
self.pieChartView.chartDescription.enabled = NO;//饼状图描述
self.pieChartView.drawHoleEnabled = YES;//饼状图是否是空心
self.pieChartView.holeRadiusPercent = 0.5;//空心半径占比
self.pieChartView.holeColor = [UIColor grayColor];//空心颜色
self.pieChartView.transparentCircleRadiusPercent = 0.55;//半透明空心半径占比
self.pieChartView.transparentCircleColor = [UIColor colorWithRed:255/255.0 green:255/255.0 blue:255/255.0 alpha:0.3];//半透明空心的颜色
if (self.pieChartView.isDrawHoleEnabled == YES) {
self.pieChartView.drawCenterTextEnabled = YES;//是否显示中间文字
//普通文本
self.pieChartView.centerText = @"数据分析";//中间文字
//富文本
// NSMutableAttributedString *centerText = [[NSMutableAttributedString alloc] initWithString:@"饼状图bbb\n饼状图aaa"];
// [centerText setAttributes:@{NSFontAttributeName: [UIFont boldSystemFontOfSize:16],
// NSForegroundColorAttributeName: [UIColor orangeColor]}
// range:NSMakeRange(0, centerText.length)];
// self.pieChartView.centerAttributedText = centerText;
}
self.pieChartView.legend.maxSizePercent = 1;//图例在饼状图中的大小占比, 这会影响图例的宽高
self.pieChartView.legend.formToTextSpace = 5;//文本间隔
self.pieChartView.legend.font = [UIFont systemFontOfSize:10];//字体大小
self.pieChartView.legend.textColor = [UIColor grayColor];//字体颜色
// self.pieChartView.legend.position = ChartLegendPositionBelowChartCenter;//图例在饼状图中的位置
self.pieChartView.legend.horizontalAlignment = ChartLegendHorizontalAlignmentRight;
self.pieChartView.legend.verticalAlignment = ChartLegendVerticalAlignmentTop;
self.pieChartView.legend.orientation = ChartLegendOrientationVertical;
self.pieChartView.legend.form = ChartLegendFormCircle;//图示样式: 方形、线条、圆形
self.pieChartView.legend.formSize = 8;//图示大小
[self.pieChartView setRotationEnabled:true];//禁止拖拽
[selfsetData];
}
最后设置给饼状图设置数据
-(PieChartData*)setData{
//每个区块的数据
//每个区块的名称或描述
NSArray *arr =@[@"12.3",@"10",@"12.7",@"25.6",@"24.4"]; //[[NSMutableArray alloc]init];
NSArray *nameArr = @[@"通码业务",@"银行充值",@"手机充值",@"Q币充值",@"包裹代收"];//[[NSMutableArray alloc]init];
// for (pieChart *model in _pieCharModel.pieChart) {
// [arr addObject:model.totalamt];//@[@"8.54",@"3.26",@"2"];
// [nameArr addObject:model.typename];
// }
NSMutableArray *values = [[NSMutableArray alloc] init];
// IMPORTANT: In a PieChart, no values (Entry) should have the same xIndex (even if from different DataSets), since no values can be drawn above each other.
for(inti =0; i < arr.count; i++){
NSString* aaa = arr[i];
doublebb = aaa.doubleValue;
[valuesaddObject:[[PieChartDataEntryalloc]initWithValue: bblabel: nameArr[i]]];
}
//dataSet
PieChartDataSet*dataSet = [[PieChartDataSetalloc]initWithValues:valueslabel:@""];
dataSet.drawValuesEnabled = YES;//是否绘制显示数据
NSMutableArray *colors = [[NSMutableArray alloc] init];
[colorsaddObjectsFromArray:ChartColorTemplates.vordiplom];
[colorsaddObjectsFromArray:ChartColorTemplates.joyful];
[colorsaddObjectsFromArray:ChartColorTemplates.colorful];
[colorsaddObjectsFromArray:ChartColorTemplates.liberty];
[colorsaddObjectsFromArray:ChartColorTemplates.pastel];
[colorsaddObject:[UIColor colorWithRed:51/255.f green:181/255.f blue:229/255.f alpha:1.f]];
dataSet.colors= colors;//区块颜色
dataSet.sliceSpace=3;//相邻区块之间的间距
dataSet.selectionShift=8;//选中区块时, 放大的半径
dataSet.xValuePosition = PieChartValuePositionInsideSlice;//名称位置
dataSet.yValuePosition = PieChartValuePositionOutsideSlice;//数据位置
//数据与区块之间的用于指示的折线样式
dataSet.valueLinePart1OffsetPercentage = 0.85;//折线中第一段起始位置相对于区块的偏移量, 数值越大, 折线距离区块越远
dataSet.valueLinePart1Length = 0.5;//折线中第一段长度占比
dataSet.valueLinePart2Length = 0.4;//折线中第二段长度最大占比
dataSet.valueLineWidth=1;//折线的粗细
dataSet.valueLineColor= [UIColorbrownColor];//折线颜色
//data
PieChartData*data = [[PieChartDataalloc]initWithDataSet:dataSet];
NSNumberFormatter *formatter = [[NSNumberFormatter alloc] init];
formatter.numberStyle = NSNumberFormatterPercentStyle;
formatter.maximumFractionDigits = 1;//小数位数
formatter.multiplier=@1.f;
[datasetValueFormatter:[[ChartDefaultValueFormatter alloc] initWithFormatter:formatter]];//设置显示数据格式
[datasetValueTextColor:[UIColor brownColor]];
[datasetValueFont:[UIFontsystemFontOfSize:10]];
self.pieChartView.data = data;
[self.pieChartView setNeedsDisplay];
returndata;
}