图表-折线图的实现

标签：

1、画坐标系

　　使用CAShapeLayer画坐标系的每一根虚线：

　　CAShapeLayer *shapeLayer = [CAShapeLayer layer];

      [shapeLayer setBounds:self.bounds];

      [shapeLayer setPosition:CGPointMake(CGRectGetWidth(self.frame) / 2, CGRectGetHeight(self.frame))];

      [shapeLayer setFillColor:[UIColor clearColor].CGColor];

      //  设置虚线颜色为blackColor

      [shapeLayer setStrokeColor:lineColor.CGColor];

      //  设置虚线宽度

      [shapeLayer setLineWidth:CGRectGetHeight(self.frame)];

      [shapeLayer setLineJoin:kCALineJoinMiter];

      //  设置线宽，线间距

      [shapeLayer setLineDashPattern:[NSArray arrayWithObjects:[NSNumber numberWithInt:lineLength], [NSNumber numberWithInt:lineSpacing], nil]];

      //  设置路径

      CGMutablePathRef path = CGPathCreateMutable();

      CGPathMoveToPoint(path, NULL, 0, 0);

      CGPathAddLineToPoint(path, NULL, CGRectGetWidth(self.frame), 0);

      [shapeLayer setPath:path];

      CGPathRelease(path);

      //  把绘制好的虚线添加上来

      [self.layer addSublayer:shapeLayer];

2、画点连线

　　根据数据源中的数据计算每个点在当前图表视图的的坐标位置，使用UIBezierPath设置路径并使用CAShapeLayer连点成线：

　　for (NSInteger i = 0; i < self.dataArr.count; i++) {

        　　NSArray *array = self.dataArr[i];

        　　UIBezierPath *path = [UIBezierPath bezierPath];

        　　for (NSInteger i = 0; i < array.count; i++) {

              ChartModel *chart = [array objectAtIndex:i];

              CGPoint point = [self getPointWithChart:chart];

              if (i == 0) {

                　　[path moveToPoint:point];

              }else {

                　　[path addLineToPoint:point];

              }

          }

        CAShapeLayer *pathLayer = [CAShapeLayer layer];

        pathLayer.frame = CGRectMake(0, 0, _kWidth, _kHeight);

        pathLayer.path = path.CGPath;

        pathLayer.strokeColor = ((UIColor *)[self.colorArr objectAtIndex:i]).CGColor;

        pathLayer.fillColor = nil;

        pathLayer.lineWidth = 1.5;

        pathLayer.lineJoin = kCALineJoinRound;

        [self.layer addSublayer:pathLayer];

    }

　　示例：

　　github地址：https://github.com/lionskl/KLChartView.git　　

图表-折线图的实现

标签：

原文地址：http://www.cnblogs.com/yangKnowledge/p/5930601.html