前面幾篇文章是《charts架構的內建》《charts餅狀圖》《charts折線圖》，建議大家結合起來看，這樣更詳細。
傳送門：
下方是柱狀圖效果圖：
核心代碼如下，大家可以按照自己的需求，修改下方配置：
// 初始化
_barChartView = [[BarChartView alloc] init];
_barChartView.frame = CGRectMake(5, 64, kSCREEN_WIDTH, kSCREEN_HEIGHT-200 );
[self.view addSubview:_barChartView];
-------------------------------柱狀圖的配置-----------------------------
// 設定XY軸動畫
[_barChartView animateWithYAxisDuration:1.0f];
[_barChartView animateWithXAxisDuration:1.0f];
// 是否繪制陰影背景
_barChartView.drawBarShadowEnabled = NO;
// 數值顯示是否在條柱上面
_barChartView.drawValueAboveBarEnabled = YES;
// 沒有資料的時候的顯示
_barChartView.noDataText = @"暫無此産品的價格趨勢";
_barChartView.noDataFont = [UIFont systemFontOfSize:15];
_barChartView.noDataTextColor = [UIColor grayColor];
// 數值顯示是否在條柱上面
_barChartView.drawValueAboveBarEnabled = YES;
// 是否畫右邊坐标軸
_barChartView.rightAxis.enabled = NO;
// 是否畫圖例(圖例的具體配置可參照我的餅狀圖)
_barChartView.legend.enabled = NO;
// 是否可以拖拽設定
_barChartView.dragEnabled = YES;
// 輕按兩下是否縮放
_barChartView.doubleTapToZoomEnabled = NO;
// XY軸是否縮放
_barChartView.scaleXEnabled = NO;//X軸縮放
_barChartView.scaleYEnabled = NO;//Y軸縮放
// XY軸是否可以同時縮放
_barChartView.pinchZoomEnabled = NO;
// 是否開啟描述label
_barChartView.chartDescription.enabled = NO;
----------------------配置折現圖上面的浮層--------------
// 設定浮層
_barChartView.drawMarkers = YES;
ChartMarkerView * makerView = [[ChartMarkerView alloc]init];
makerView.offset = CGPointMake(-self.subPriceView.frame.size.width,-self.subPriceView.frame.size.height/2);
makerView.chartView = _lineChartView;
_barChartView.marker = makerView;
[makerView addSubview:self.subPriceView];
-------------------------------配置X軸-----------------------
// 擷取X軸
ChartXAxis *xAxis = _barChartView.xAxis;
// X軸的顯示位置
xAxis.labelPosition = XAxisLabelPositionBottom;
// 是否繪制網格
xAxis.drawGridLinesEnabled = NO;
// X軸數值上面的字型 大小
xAxis.labelFont = [UIFont fontWithName:@"PingFang-SC-Medium" size:10.0f];
// X軸數值顔色
xAxis.labelTextColor = [UIColor colorWithRed:153/255.f green:153/255.f blue:153/255.f alpha:1];
// X軸label寬度
xAxis.labelWidth=5;
// X軸顯示的label數量
xAxis.labelCount=5;
// 設定虛線樣式的網格線
xAxis.gridLineDashLengths = @[@3.0f, @3.0f];
// 網格線顔色
xAxis.gridColor = [UIColor colorWithRed:153/255.f green:153/255.f blue:153/255.f alpha:1];
// 開啟抗鋸齒
xAxis.gridAntialiasEnabled = YES;
// 從0開始繪畫
xAxis.drawZeroLineEnabled = YES;
// label位置(像裡像外 枚舉類型)
xAxis.labelPosition = 0;
------------------------------Y軸配置---------------------------
基本配置如X軸
下面為補充：
// 擷取Y軸
ChartYAxis *leftAxis = _barChartView.leftAxis;
// 坐标數值樣式
NSNumberFormatter *leftAxisFormatter = [[NSNumberFormatter alloc] init];
// Y軸坐标最多為1位小數
leftAxisFormatter.maximumFractionDigits=1;
leftAxis.valueFormatter = [[ChartDefaultAxisValueFormatter alloc] initWithFormatter:leftAxisFormatter];
// 最大值
leftAxis.axisMaximum=60;
// 最小值
leftAxis.axisMinimum=0;
// 坐标數值的位置
leftAxis.labelPosition = YAxisLabelPositionOutsideChart;
// 數值分割個數
leftAxis.labelCount=8;
// 最大值到頂部的範圍比
leftAxis.spaceTop=0.15;
------------------------------------設定條狀圖對象---------------------------
// bar的顔色
[set1setColor:[UIColor colorWithRed:219/255.f green:50/255.f blue:59/255.f alpha:1]];
// 數值的顔色
[set1setValueTextColor: [UIColor whiteColor]];
// 是否在bar上顯示數值
[set1 setDrawValuesEnabled:NO];
// 是否點選有高亮效果，為NO是不會顯示marker的效果
[set1setHighlightEnabled:NO];
-----------------------------------設定資料------------------------------
BarChartData*data = [[BarChartData alloc]initWithDataSets:dataSets];
// 設定寬度 柱形之間的間隙占整個柱形(柱形+間隙)的比例
[datasetBarWidth:0.6];
[datasetValueFont:[UIFontsystemFontOfSize:10]];
_barChartView.data = data;
[_barChartView notifyDataSetChanged];
==================第二條柱子實作(隻有一根柱子的可以不看)==========
01.集合内添加2個集合對象。
02.間距的設定，如果不寫這行代碼，2根柱子則會重合
[data groupBarsFromX: startYeargroupSpace: groupSpacebarSpace: barSpace];
=======================舉例如下=======================
- (void)setDataCount:(int)count {
NSMutableArray *yVals = [[NSMutableArray alloc] init];
for(inti =0; i < count; i++) {
intval = (double) (arc4random_uniform(60))+2;
[yValsaddObject:[[BarChartDataEntryalloc]initWithX:iy:val]];
}
NSMutableArray *yVals2 = [[NSMutableArray alloc] init];
for(inti =0; i < count; i++) {
intval2 = (double) (arc4random_uniform(60));
[yVals2addObject:[[BarChartDataEntryalloc]initWithX:iy:val2]];
}
BarChartDataSet *set1 = [[BarChartDataSet alloc] initWithValues:yVals label:@"Set1"];[set1setColor:[UIColor colorWithRed:219/255.f green:50/255.f blue:59/255.f alpha:1]];//bar的顔色
[set1setDrawValuesEnabled:NO];
[set1setHighlightEnabled:NO];
BarChartDataSet *set2 = [[BarChartDataSet alloc] initWithValues:yVals2 label:@"DataSet2"];
[set2setColor:[UIColor colorWithRed:255/255.f green:152/255.f blue:46/255.f alpha:1]];//bar的顔色
[set2setDrawValuesEnabled:NO];//是否在bar上顯示數值
[set2setHighlightEnabled:NO];//是否點選有高亮效果，為NO是不會顯示marker的效果
NSMutableArray *dataSets = [[NSMutableArray alloc] init];
[dataSetsaddObject:set1];
[dataSetsaddObject:set2];
BarChartData*data = [[BarChartDataalloc]initWithDataSets:dataSets];
[datasetBarWidth:0.4];
[datasetValueFont:[UIFontsystemFontOfSize:10]];
[datagroupBarsFromX: -0.3 groupSpace: 0.15f barSpace: 0.02f];
_barChartView.data = data;
[_barChartView notifyDataSetChanged];
[_barChartView.data notifyDataChanged];
}
有問題的可以加群：191409807 歡迎話痨。喜歡交流的也可以加群，想要demo的同樣可以加群。