iOS 图表demo

  最近在看股票软件，看到k线图，于是就想自己画个图表出来，以下是我画图表的思路。
  首先,分析一般业务，图表不一定是一个屏幕尺寸，可能需要延伸，所以我选择在scrollview上进行绘制。然后图表的内容使用CALayer和berzerPath来绘制,下面是绘制过程中的代码分析。然后，为了视觉的集中，我默认是在图表纵向的0.35~0.65处进行绘制内容，当然这个可以手动设置，最后说明下需要传入必选参数有dataSource，其他参数及说明如下：

@property (nonatomic, copy) NSArray <NSString *> *horizontalTitleArray;//x轴方向

@property (nonatomic, copy) NSArray <PQChartPoint *> *dataSource;//数据源

@property (nonatomic, strong) UIColor *lineColor;//连线颜色

@property (nonatomic, strong) UIColor *maskColor;//连线同x\y轴组成部分颜色

@property (nonatomic, assign) CGFloat singleWidth;//每个数据源x方向间隔，默认是74.0f

@property (nonatomic, assign) CGFloat startHeightScale;//起始高度，默认为0.35

@property (nonatomic, assign) CGFloat endHeightScale;//终止高度，默认为0.65

1. 因为该控件只做了水平方向上滑动，所以水平方向的每个单位间距是由外部传入的，但是纵向的每个单位的间距是通过最大值和最小值计算得到的；
2. 在确定了间距之后，把scrollview添加上，scrollview是根据数据源和间距计算得到的；
3. 接下来这步是最重要的，确定数据源对应节点在scrollview上的位置；
4. 根据节点的位置绘制虚线和连接线；
5. 根据连线和横纵坐标位置，绘制maskLayer；
6. 绘制横坐标的标签；

- (void)drawRect:(CGRect)rect {
    [super drawRect:rect];
    [self.scrollView removeFromSuperview];
    //1、先计算出数据源每个单位占屏幕单位
    [self calculateDataSource];
    //2、添加scrollview
    [self addScrollView];
    //2、确定每个点的位置，并添加每个点的点击事件
    [self drawPoints];
    //3、连接起各个点
    [self addLineAndDashLine];
    //4、画底部遮罩层
    [self addMask];
    //添加横坐标标签
    [self addHorizontalTitleLabel];
}

到此，一个图表就绘制完成了，可能这个控件还不足以满足所有的业务，但是可以在这个基本思路上进行修改，例如如果要新增动画的，可以在layer上添加anime，如果想纵向滑动，则可以类推的做修改；因为图标的业务很多，而且各不相同，所以就不把这个控件做大，大家可以在这个基础上进行修改。实现效果如下：

效果图.png

项目demo
可以通过cocoapod导入项目中