關于charts的系列視圖介紹傳送門:
iOS 圖表工具charts介紹
iOS 圖表工具charts之LineChartView
iOS 圖表工具charts之BarChartView
iOS 圖表工具charts之PieChartView
iOS 圖表工具charts之CandleStickChartView
iOS 圖表工具charts之CombinedChartView
BarChartView在charts中可以用來繪制柱狀圖,由于charts是基于swift開發的,如果需要和objective-C混編(通過pod的方式不用管),可以參考我的上幾篇文章《iOS OC中橋接swift第三方庫》,這里主要講的是LineChartView的一些常用屬性和一些基本用法,實際情況以開發為準
chartView的更加細節的屬性設置 請查看我的上篇文章《iOS 圖表工具charts之LineChartView》,因為BarChartView大部分基礎屬性都差不多,這里就不詳細寫注釋了
BarChartView的基礎設置
-(void)setupUI{//BarChartView默認縱向展示柱狀圖, 如果需要橫向展示 則創建HorizontalBarChartView即可BarChartView *chartView = [[BarChartView alloc] init];//設置偏移[chartView setExtraOffsetsWithLeft:10 top:10 right:10 bottom:10];//開啟borderchartView.drawBordersEnabled = YES;chartView.borderLineWidth = .5f;chartView.borderColor = UIColor.blackColor;//設置背景chartView.drawGridBackgroundEnabled = NO;chartView.gridBackgroundColor = [UIColor grayColor];//無內容顯示chartView.noDataText = @"";//關閉描述chartView.chartDescription.enabled = NO;chartView.chartDescription.text = @"tiny`s barChart demo";//關閉圖例chartView.legend.enabled = NO;//縮放chartView.scaleXEnabled = NO;chartView.scaleYEnabled = NO;chartView.autoScaleMinMaxEnabled = YES;chartView.highlightPerTapEnabled = NO;chartView.highlightPerDragEnabled = NO;chartView.pinchZoomEnabled = NO; //手勢捏合chartView.dragEnabled = YES;chartView.dragDecelerationFrictionCoef = 0.5; //0 1 慣性//代理chartView.delegate = self;//leftAxisChartYAxis *leftAxis = chartView.leftAxis;leftAxis.enabled = YES;leftAxis.labelPosition = YAxisLabelPositionOutsideChart;leftAxis.drawGridLinesEnabled = YES;leftAxis.gridLineDashLengths = @[@2,@4];leftAxis.labelTextColor = UIColor.blackColor;leftAxis.labelFont = [UIFont systemFontOfSize:10];leftAxis.decimals = 2;//設置樣式LeftAxisFormatter *leftFormatter = [LeftAxisFormatter new];leftAxis.valueFormatter = leftFormatter;//rightAxisChartYAxis *rightAxis = chartView.rightAxis;rightAxis.enabled = NO;//xAxisChartXAxis *xAxis = chartView.xAxis;xAxis.enabled = YES;xAxis.labelPosition = XAxisLabelPositionBottom;//不畫線xAxis.drawGridLinesEnabled = NO;BarxAxisFormatter *xFormatter = [BarxAxisFormatter new];xAxis.valueFormatter = xFormatter;xFormatter.titles = @[@"語文",@"數學",@"外語",@"物理"];self.charView = chartView;[self addSubview:self.charView];[self.charView mas_makeConstraints:^(MASConstraintMaker *make) {make.edges.mas_offset(0);}];//draw[self drawData];//執行動畫[self.charView animateWithYAxisDuration:1.f];
}-(void)drawData{NSArray *datas = @[@100,@90,@76,@55,@45,@77,@98,@62];NSMutableArray *array = [NSMutableArray array];for (int i = 0; i < datas.count; i++) {BarChartDataEntry *entry = [[BarChartDataEntry alloc] initWithX:i y:[datas[i] integerValue]];[array addObject:entry];}//setBarChartDataSet *set = [[BarChartDataSet alloc] initWithEntries:array label:@"Bar DataSet"];[set setColors:@[UIColor.redColor,UIColor.blueColor,UIColor.blueColor,UIColor.blackColor,UIColor.cyanColor,UIColor.grayColor,UIColor.greenColor,UIColor.cyanColor]];//顯示柱圖值并格式化NSNumberFormatter *numberFormatter = [[NSNumberFormatter alloc] init];numberFormatter.positiveSuffix = @"分";ChartDefaultValueFormatter *formatter = [[ChartDefaultValueFormatter alloc] initWithFormatter:numberFormatter];[set setValueFormatter:formatter];set.highlightEnabled = NO;BarChartData *data = [[BarChartData alloc] initWithDataSet:set];self.charView.data = data;
}#pragma mark - ChartViewDelegate
#pragma mark 圖表中數值被選中
-(void)chartValueSelected:(ChartViewBase *)chartView entry:(ChartDataEntry *)entry highlight:(ChartHighlight *)highlight{// NSLog(@"圖表中數值被選中");
}#pragma mark 圖表中的空白區域被選中
-(void)chartValueNothingSelected:(ChartViewBase *)chartView{
// NSLog(@"空白區域被選中");
}#pragma mark 圖表被縮放
-(void)chartScaled:(ChartViewBase *)chartView scaleX:(CGFloat)scaleX scaleY:(CGFloat)scaleY{
// NSLog(@"圖表被縮放");
}#pragma mark 圖表被移動
-(void)chartTranslated:(ChartViewBase *)chartView dX:(CGFloat)dX dY:(CGFloat)dY{
// NSLog(@"圖表被移動");
}
一些需要注意的點:
1.如果需要給每個bar顯示的數字格式化比如 100分, 100t,100g等等添加前綴或者后綴,則可以設置BarChartDataSet屬性
NSNumberFormatter *numberFormatter = [[NSNumberFormatter alloc] init];numberFormatter.positiveSuffix = @"分";ChartDefaultValueFormatter *formatter = [[ChartDefaultValueFormatter alloc] initWithFormatter:numberFormatter];[set setValueFormatter:formatter];
2.柱狀圖動畫效果
//執行動畫[self.charView animateWithYAxisDuration:1.f];
3.顏色可以沒每個柱子設置顏色
[set setColors:@[UIColor.redColor,UIColor.blueColor,UIColor.blueColor,UIColor.blackColor,UIColor.cyanColor,UIColor.grayColor,UIColor.greenColor,UIColor.cyanColor]];
4.每個點的數值要顯示出來
set.drawValuesEnabled = YES;
5.柱狀圖橫向顯示,只需要將BarChartView換成HorizontalBarChartView即可,其他不變 效果圖如下:
6.BarChartData可以添加多個柱子
BarChartData *data = [[BarChartData alloc] init][data addDataSet:set]
轉載請標注來源:https://www.cnblogs.com/qqcc1388/
轉載于:https://www.cnblogs.com/qqcc1388/p/11171939.html
總結
以上是生活随笔為你收集整理的iOS 图表工具charts之BarChartView的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。