#pragma mark---折线图 遵循代理 <ChartViewDelegate,IChartAxisValueFormatter,IChartFillFormatter,IChartValueFormatter>
#pragma mark---折线图
///添加限制线
-(ChartLimitLine *)createLilitLineLine:(CGFloat)limit label:(NSString *)label{
//最高 最大限制线
ChartLimitLine *limitLine = [[ChartLimitLine alloc] initWithLimit:limit label:label];
//线条描述文字 位置 字体 颜色
limitLine.labelPosition = ChartLimitLabelPositionTopLeft;
limitLine.valueFont = [UIFont systemFontOfSize:9];
//文字颜色
limitLine.valueTextColor = rgba(90, 107, 200, 1);
//线条高度
limitLine.lineWidth = 1.0;
//线条颜色
limitLine.lineColor = rgba(236, 105, 65, 1);
//@[@5.f, @15.f] 宽度 间隔
limitLine.lineDashLengths = @[@5.f, @5.f];
return limitLine;
}
-(void)showChart{
/**
一个刻度的宽度是35,x轴显示9格,y轴显示5格
*/
_chartView = [[LineChartView alloc] init];
_chartView.delegate = self;
_chartView.frame = CGRectMake(WMAKENEW(7), WMAKENEW(25), SCREEN_WIDTH-WMAKENEW(12)-WMAKENEW(12)-WMAKENEW(12), self.oneSpaceWidth*5);
[self.backView addSubview:_chartView];
_chartView.chartDescription.enabled = NO;
_chartView.dragEnabled = YES;
[_chartView setScaleEnabled:YES];
_chartView.pinchZoomEnabled = YES;
_chartView.drawGridBackgroundEnabled = NO;
//类表示y轴标签设置及其项。
ChartYAxis *leftAxis = _chartView.leftAxis;
[self setXYLineInfo:leftAxis];
#pragma mark---特殊部分
//添加 标识线
[leftAxis addLimitLine:[self createLilitLineLine:90.0 label:@"上面的线"]];
//是否显示底部或顶部刻度
leftAxis.drawTopYLabelEntryEnabled = YES;
#warning 注意 如果drawBottomYLabelEntryEnabled = NO 可能导致最下面的刻度不显示
leftAxis.drawBottomYLabelEntryEnabled = YES;
//左侧Y轴刻度位置
leftAxis.labelPosition = YAxisLabelPositionOutsideChart;
_chartView.rightAxis.enabled = NO;//右侧轴线不显示
///点击选中时出现的泡泡
BalloonMarker *marker = [[BalloonMarker alloc]
initWithColor: rgba(87, 174, 255, 1)
font: FONT(12)
textColor: UIColor.whiteColor
insets: UIEdgeInsetsMake(8.0, 8.0, 20.0, 8.0)];
marker.chartView = _chartView;
marker.minimumSize = CGSizeMake(40.f, 40.f);
_chartView.marker = marker;
// 是否在左下侧显示每个颜色所代表的的折线以及其名称
_chartView.legend.form = ChartLegendFormNone;
_chartView.legend.enabled = NO;
//多长时间加载完成数据
[_chartView animateWithXAxisDuration:1];
ChartXAxis *xAxis = _chartView.xAxis;
[self setXYLineInfo:xAxis];
//设置x轴位置
xAxis.labelPosition = XAxisLabelPositionBottom;
//手动设至坐标轴上显示信息 可以添加单位等信息 需要遵守 ChartAxisValueFormatter,并实现其方法
xAxis.valueFormatter = self;
xAxis.labelFont = FONT(10);
/**
最右边的坐标或者最上面的坐标被遮盖一半显示不全,设置偏移量避免显示不全
避免X坐标轴刻度文字显示不全解决方法
方法一
*/
xAxis.avoidFirstLastClippingEnabled = YES;//方法一 避免X轴文字显示不全
_chartView.extraRightOffset = WMAKENEW(20);//方法二 避免X轴文字显示不全
/**
X轴和Y轴两个刻度数的间距是自动计算的,需要按照你自己的数据来设置_chartView的宽和高
*/
// 画刻度线 自己把网格线改成了刻度线
leftAxis.drawGridLinesEnabled = xAxis.drawGridLinesEnabled = YES;
leftAxis.gridColor = xAxis.gridColor = leftAxis.axisLineColor;
leftAxis.gridLineWidth = xAxis.gridLineWidth = leftAxis.axisLineWidth;
_chartView.noDataText = @"暂无数据";
_chartView.noDataTextColor = UIColor.redColor;
_chartView.noDataFont = FONT(14);
}
///设置坐标轴信息
-(void)setXYLineInfo:(ChartAxisBase *)axisBase{
//类表示标签设置及其项。
[axisBase removeAllLimitLines];
#warning 注意 如果不设置axisMaximum axisMinimum,系统会自动根据数据进行显示
// axisBase.axisMaximum =100;
// axisBase.axisMinimum = -100;
axisBase.gridLineDashLengths = @[@5.f, @5.f];
axisBase.gridLineWidth = 6;
axisBase.gridColor = rgba(90, 107, 200, 1);
axisBase.labelTextColor = rgba(90, 107, 200, 1);
/**
避免放大到一定级别后坐标轴上出现重复数据,两种方法
*/
axisBase.granularityEnabled = YES;//方法一 设置重复不显示
axisBase.granularity = 1; //方法二 设置坐标轴值之间最小距离,这里是指定相邻标签间最小差,防止重复
//设置轴的 颜色 宽度
axisBase.axisLineColor = rgba(90, 107, 200, 1);
axisBase.axisLineWidth = 1;
//设置之后就会变成虚线
// axisBase.axisLineDashLengths = @[@5.f,@10.f];
//是否显示轴网格虚线
axisBase.drawGridLinesEnabled = NO;
axisBase.gridLineWidth = 1;
axisBase.gridLineCap = 10;
//可以设置网格线长度,@[@(10),@(1),@(16)] 就代表第一个长度为10第二个1第三个16
// axisBase.gridLineDashLengths = @[@(10),@(1),@(16)];
// axisBase.gridLineDashPhase = 1;
axisBase.drawLimitLinesBehindDataEnabled = YES;
axisBase.gridAntialiasEnabled = NO;
//手动设至坐标轴上显示信息 可以添加单位等信息 需要遵守 ChartAxisValueFormatter,并实现其方法
axisBase.valueFormatter = self;
//显示几个刻度
// axisBase.labelCount = 5;
/**
上面是基本设置
下面是X轴Y轴的特殊属性
*/
// //绘制底部 绘制零线
// axisBase.drawZeroLineEnabled = YES;
// axisBase.zeroLineWidth = 10;
// axisBase.zeroLineColor = [UIColor yellowColor];
// //左侧Y轴刻度位置
// axisBase.labelPosition = YAxisLabelPositionOutsideChart;
// //是否显示底部或顶部刻度
// axisBase.drawTopYLabelEntryEnabled = YES;
#warning 注意 如果drawBottomYLabelEntryEnabled = NO 可能导致最下面的刻度不显示
// axisBase.drawBottomYLabelEntryEnabled = YES;
// axisBase.avoidFirstLastClippingEnabled = YES;//方法一 避免X轴文字显示不全
}
#pragma mark - ChartViewDelegate
- (void)chartValueSelected:(ChartViewBase * __nonnull)chartView entry:(ChartDataEntry * __nonnull)entry highlight:(ChartHighlight * __nonnull)highlight
{
NSLog(@"chartValueSelected");
}
- (void)chartValueNothingSelected:(ChartViewBase * __nonnull)chartView
{
NSLog(@"chartValueNothingSelected");
}
#pragma mark - IChartValueFormatter delegate (折线值) 自定义显示所画的每个点的值
- (NSString *)stringForValue:(double)value entry:(ChartDataEntry *)entry dataSetIndex:(NSInteger)dataSetIndex viewPortHandler:(ChartViewPortHandler *)viewPortHandler {
if (value>60 || value<20) {
return nil;
}else{
return nil;
}
}
#pragma mark - IChartAxisValueFormatter delegate (y轴值) (x轴的值写在DateValueFormatter类里, 都是这个协议方法)
- (NSString *)stringForValue:(double)value axis:(ChartAxisBase *)axis {
if ([axis isKindOfClass:[ChartYAxis class]]) {
return [NSString stringWithFormat:@"%.f", value];
}else{
return [NSString stringWithFormat:@"%.f", value];
}
}
-(CGFloat)getFillLinePositionWithDataSet:(id<ILineChartDataSet>)dataSet dataProvider:(id<LineChartDataProvider>)dataProvider{
return 1;
}
-(void)showNeedData:(NSArray *)values{
NSArray *oldDataSet = [_chartView.data.dataSets mutableCopy];
if (oldDataSet.count>0) {
for (LineChartDataSet *subData in oldDataSet) {
[_chartView.data removeDataSet:subData];
}
[_chartView setNeedsDisplay];
}
//每次新修改
NSMutableArray *dataSets = [[NSMutableArray alloc] init];
for (NSArray *subArr in values) {
[dataSets addObject:[self setDataSet:subArr]];
}
LineChartData *data = [[LineChartData alloc] initWithDataSets:dataSets];
_chartView.data = data;
if (self.isFirstShow) {
self.oneTimer.fireDate = [NSDate distantPast];
}
[_chartView setNeedsDisplay];
}
-(LineChartDataSet *)setDataSet:(NSArray *)values{
LineChartDataSet *set1 = nil;
//设置点
set1 = [[LineChartDataSet alloc] initWithEntries:values label:@""];
set1.drawIconsEnabled = NO;//画点对应的图片
[set1 setColor:rgba(87, 174, 255, 1)];//线的颜色
[set1 setCircleColor:rgba(87, 174, 255, 1)];//点的颜色
set1.valueFont = FONT(9);//折线拐点处显示数据的字体
set1.valueTextColor = rgba(87, 174, 255, 1);//折线拐点处显示数据的颜色
// set1.lineDashLengths = @[@5.f, @2.5f];
// set1.highlightLineDashLengths = @[@5.f, @2.5f];
// set1.valueColors = @[UIColor.redColor,UIColor.blackColor,UIColor.clearColor];//折线拐点处显示数据的颜色,自定义每个点的颜色
// set1.fillFormatter = self;
//左下角 线条以及文字描述
// set1.label = @"我的名字";
// set1.formLineDashLengths = @[@5.f, @2.5f];
// set1.formLineWidth = 0.0;//设置成0不显示
// set1.formSize = 15.0;
set1.valueFormatter = self;//自定义显示所画的每个点的值,需要遵循IChartValueFormatter协议
set1.lineWidth = 1.0;
set1.circleRadius = 3;//拐点的圆的半径
set1.drawCircleHoleEnabled = NO;//是否绘制中间的空心
set1.circleHoleRadius = 1.0f;//空心的半径
set1.circleHoleColor = rgba(87, 174, 255, 1);//空心的颜色
set1.drawFilledEnabled = NO;//是否填充颜色,就是折线下方覆盖部分的颜色
// set1.axisDependency = AxisDependencyRight;//轴线方向 可能会导致Y轴刻度显示出错不知道为什么?
set1.highlightColor = [UIColor yellowColor];//选中线条颜色
set1.highlightLineWidth = 1.00f;
if (values.count==1) {
set1.drawCirclesEnabled = YES;//是否绘制拐点
}else{
set1.drawCirclesEnabled = NO;//是否绘制拐点
}
return set1;
}
- (void)setDataCount:(int)count range:(double)range
{
NSMutableArray *values = [[NSMutableArray alloc] init];
for (int i = 0; i < 0+count; i++){
#warning 如果可能是负数,不能直接将Y或者X的值写到初始化方法上
/**
这样不行
[[ChartDataEntry alloc] initWithX:nowX y:(100 - arc4random_uniform(150)) icon: [UIImage imageNamed:@"icon"]];
这样才可以
[ChartDataEntry alloc] initWithX:nowX y:nnnnn icon: [UIImage imageNamed:@"icon"]];
*/
NSInteger nowX = i*3;
if (i%10) {
[values addObject:[[ChartDataEntry alloc] initWithX:nowX y:-i icon: [UIImage imageNamed:@"icon"]]];
}else{
[values addObject:[[ChartDataEntry alloc] initWithX:nowX y:i+10 icon: [UIImage imageNamed:@"icon"]]];
}
}
self.chartView.xAxis.axisMinimum = 0;
self.chartView.leftAxis.axisMinimum = -100;
self.chartView.leftAxis.axisMaximum = 100;
[self showNeedData:@[values]];
}