在進行曲線圖漸變圖層繪制的時候屈芜，根據(jù)實際需要签钩，在CFLineChartView的基礎(chǔ)上增加了曲線繪制，和點擊顯示數(shù)值的處理帜慢。

漸變圖層的繪制笼裳，百度了不少資料唯卖，可以新建漸變圖層躬柬，然后為漸變圖層設(shè)置mask路徑即可拜轨。

效果圖：

屏幕快照 2017-07-17 下午5.10.42.png

1.簡單計算，確定x,y軸上的均值允青，以及通過記錄最大Y值橄碾，和確定Y軸上最多有幾個點
2.進行X軸和Y軸上的文本顯示處理
3.繪制網(wǎng)格線

- (void)drawLines{
    UIBezierPath *path = [UIBezierPath bezierPath];
    //豎線 兩條
    for (int i = 0; i < 2; i++) {
        [path moveToPoint:CGPointMake(HHLeftMargin+allW*i, HHTopMargin)];
        [path addLineToPoint:CGPointMake(HHLeftMargin+allW*i, HHTopMargin+allH)];
    }
    
    //橫線 包括x軸
    for (int i = 0; i <= yCount; i++) {
        [path moveToPoint:CGPointMake(HHLeftMargin, HHViewSelfHeight-HHBottomMargin-everyY*i)];
        [path addLineToPoint:CGPointMake(HHViewSelfWidth-HHRightMargin, HHViewSelfHeight-HHBottomMargin-everyY*i)];
    }
    CAShapeLayer *shapeLayer = [CAShapeLayer layer];
    shapeLayer.path = path.CGPath;
    shapeLayer.strokeColor = self.gridLineColor.CGColor;
    shapeLayer.fillColor = [UIColor clearColor].CGColor;
    shapeLayer.lineWidth = 1;
    [self.layer addSublayer:shapeLayer];
}

4.計算點的坐標（可在此步驟進行點的繪制）
5.曲線繪制和漸變填充

- (void)drawCurvePath{
//    [self gradientLayer];
    
    _path = [UIBezierPath bezierPath];
    [_path moveToPoint:[_pointArr[0] CGPointValue]];
    
    for (int i = 1; i < _pointArr.count; i++) {
        CGPoint prePoint = [_pointArr[i-1] CGPointValue];
        CGPoint nowpoint = [_pointArr[i] CGPointValue];
        
        //控制點 x均為兩個點的中點
        CGPoint controlPoint1 = CGPointMake((prePoint.x+nowpoint.x)/2, prePoint.y);
        CGPoint controlPoint2 = CGPointMake((prePoint.x+nowpoint.x)/2, nowpoint.y);
        [_path addCurveToPoint:nowpoint controlPoint1:controlPoint1 controlPoint2:controlPoint2];
    }
    
}

- (void)drawCurveLine{
    CAShapeLayer *shapeLayer = [CAShapeLayer layer];
    shapeLayer.path = _path.CGPath;
    shapeLayer.strokeColor = self.curveColor.CGColor;
    shapeLayer.fillColor = [UIColor clearColor].CGColor;
    shapeLayer.lineWidth = 1;
    [self.layer addSublayer:shapeLayer];
}

- (void)drawGradientLayer{
    UIBezierPath *gradientPath = [UIBezierPath bezierPathWithCGPath:_path.CGPath];

    gradientPath.lineWidth = 0.01;
    [gradientPath addLineToPoint:_xendPoint];
    [gradientPath addLineToPoint:_xStartPoint];
    [gradientPath addLineToPoint:[_pointArr[0] CGPointValue]];
    [gradientPath closePath];
    
    
    
    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.frame = self.bounds;
    NSArray *colors = @[(__bridge id)self.gradientStartColor.CGColor,(__bridge id)self.gradientEndColor.CGColor];
    gradientLayer.colors = colors;
    gradientLayer.locations = @[@0,@1];
    gradientLayer.startPoint = CGPointMake(0, 0);
    gradientLayer.endPoint = CGPointMake(0, 1);
    [self.layer addSublayer:gradientLayer];
    _gradientLayer = gradientLayer;
    
    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.strokeColor = [UIColor clearColor].CGColor;
    maskLayer.path = gradientPath.CGPath;
    maskLayer.lineWidth = 0.01;
    //    maskLayer.fillColor = [UIColor whiteColor].CGColor;
    self.gradientLayer.mask = maskLayer;
    
}

5.觸摸時顯示點的視圖添加

demo：https://github.com/HannahZheng/singleChart