最近公司項目中需要用到折線圖，本來想著使用成熟的第三方框架，但是不能很好地滿足項目需求，索性自己實現和封裝了一個。

1.功能簡介

支持或滿足以下功能，如下：

• x軸、y軸分別可支持是否顯示，以及它的顏色、線寬
• x軸文字支持大小、顏色、旋轉
• y軸文字可支持是否顯示、大小、顏色、格式
• y軸坐標值可不設置，可根據點的值自動計算
• 折線圖可支持設置邊距
• 橫向分隔虛線可支持是否顯示，以及它的顏色、線寬
• 折線可支持動畫、顏色、線寬，支持顯示一條或多條折線
• 折線可支持直線、貝塞爾曲線
• 折線上的點支持是否顯示、填充顏色、描邊顏色，以及有圓形、方形、三角形三種形狀可選
• 折線上的點支持是否顯示文字，以及文字的顏色、大小以及格式
• 可支持顯示漸變區域
• 可支持折線圖數據更新

大家肯定會說：無圖說個JB。行，先上效果圖，是不是有種熟悉的感覺？

折線圖.png

2.實現步驟

實現步驟大概如下：

1. 首先繪制x軸、y軸、分割點和橫向網格虛線
2. 創建并顯示x軸和y軸的文字控件
3. 計算所有折線上點的位置
4. 繪制折線以及折線上的點
5. 創建并顯示折線上點的文字控件

實現步驟很清晰，看上去不難，其實里面有很多細節需要調整和優化，比較花時間。

3.如何使用

那我直接上代碼，這樣就一目了然，使用起來還是很簡單的

GBLineChart *chart = [[GBLineChart alloc] initWithFrame:CGRectMake(0, 100, CGRectGetWidth(self.view.bounds), 220)];
    [self.view addSubview:chart];
    chart.xLabelTitles = @[@"1月",@"2月",@"3月",@"4月",@"5月",@"6月",@"7月",@"8月",@"9月",@"10月",@"11月",@"12月",];
    chart.yLabelTitles = @[@"0", @"20", @"40", @"60", @"80", @"100"];
    chart.xLabelRotationAngle = M_PI/6;
    chart.showCoordinateAxis = YES;
    chart.xLabelAlignmentStyle = GBXLabelAlignmentStyleFullXAxis;
    
    NSMutableArray *array = [NSMutableArray array];
    NSMutableArray *array1 = [NSMutableArray array];

    for (int i = 0; i < chart.xLabelTitles.count; i++) {
        NSNumber *a = [NSNumber numberWithInteger:arc4random() % 100];
        [array addObject:a];
        [array1 addObject:[NSNumber numberWithInteger:arc4random() % 100]];
    }
    
    GBLineChartData *data = [GBLineChartData new];
    data.lineAlpha = 0.7;
    data.lineColor = [UIColor blueColor];
    data.lineWidth = 1;
    data.itemCount = array.count;
    data.lineChartPointStyle = GBLineChartPointStyleCircle;
    data.inflexionPointStrokeColor = [UIColor redColor];
    data.inflexionPointFillColor = [UIColor greenColor];
    data.inflexionPointWidth = 6;
    data.showDash = YES;
    data.lineDashPattern = @[@1,@1];
    
    data.showPointLabel = YES;
    data.pointLabelFont = [UIFont systemFontOfSize:10];
    data.pointLabelColor = [UIColor blackColor];
    data.pointLabelFormat = @"%0.1f";
    
    data.dataGetter = ^GBLineChartDataItem *(NSInteger item) {
      
        return [GBLineChartDataItem dataItemWithY:[array[item] floatValue]];
    };
    
    GBLineChartData *data1 = [GBLineChartData new];
    data1.lineAlpha = 1;
    data1.lineColor = [UIColor orangeColor];
    data1.lineWidth = 1;
    data1.itemCount = array1.count;
    data1.lineChartPointStyle = GBLineChartPointStyleSquare;
    data1.inflexionPointStrokeColor = [UIColor cyanColor];
    data1.inflexionPointWidth = 5;
    
    data1.showPointLabel = NO;
    data1.pointLabelFont = [UIFont systemFontOfSize:10];
    data1.pointLabelColor = [UIColor blackColor];
    data1.pointLabelFormat = @"%1.0f";
    data1.showGradientArea = YES;
    data1.startGradientColor = [[UIColor yellowColor] colorWithAlphaComponent:0.6];
    data1.endGradientColor = [[UIColor whiteColor] colorWithAlphaComponent:0.0];
    
    data1.dataGetter = ^GBLineChartDataItem *(NSInteger item) {
        
        return [GBLineChartDataItem dataItemWithY:[array1[item] floatValue]];
    };
    
    chart.lineChartDatas = @[data, data1];
    chart.chartMarginLeft = 25;

    chart.yLabelBlockFormatter = ^NSString *(CGFloat value) {
      
        return [NSString stringWithFormat:@"%0.0f", value];
    };
    chart.showSmoothLines = YES;
    [chart strokeChart];
    _lineChart = chart;

嗯，是吧！使用起來還是很簡單的。知道你們會說最后demo地址，放心，會有的。這不來了么？
傳送門：折線圖Demo下載
好了，最后希望大大們下載和使用，提出寶貴意見，一起學習進步~~~