IOS端K线系列之K线-绘制OHLC图、线段、圆形

版权声明:本文为员凯的原创文章,欢迎转载,转载请注明来源(http://blog.csdn.net/nethanhan) https://blog.csdn.net/yunkai666/article/details/72726254

k线系列目录

查看目录请点击这儿


接着上篇文章继续说。在上文中我们把蜡烛绘制完,也讲到在K线中常见的几种图形:

  1. 蜡烛
  2. OHLC
  3. 线段
  4. 带状
  5. 圆形

那在这篇文章里,我们把其余的也绘制一下,争取做一个基础的类库,这样在开发框架时就可以直接使用。


OHLC图

先上两张效果图:

OHLC图

OHLC图

如图所示,它是由4个数据生成:开盘、收盘、最高、最低。中间的线是最高点至最低点连接而成,两边的分别是开盘点和收盘点与中间线连接而成。

OK,知道思路以后,直接上代码:

/**
 生成OHLC

 @param model 蜡烛坐标模型
 @return 返回图层
 */
+ (CAShapeLayer *)getOHLCLayerWithPointModel:(YKCandlePointModel *)model
{
    //判断是否为涨跌
    BOOL isRed = model.oPoint.y >= model.cPoint.y ? YES : NO;

    UIBezierPath *path = [UIBezierPath bezierPath];
    //绘制上下影线
    [path moveToPoint:model.lPoint];
    [path addLineToPoint:model.hPoint];
    //开盘线
    [path moveToPoint:model.oPoint];
    [path addLineToPoint:CGPointMake(model.oPoint.x -6, model.oPoint.y)];
    //开盘线
    [path moveToPoint:model.cPoint];
    [path addLineToPoint:CGPointMake(model.cPoint.x +6, model.cPoint.y)];

    CAShapeLayer *layer = [CAShapeLayer layer];
    layer.path = path.CGPath;

    //判断涨跌来设置颜色
    if (isRed)
    {
        //涨,设置红色
        layer.strokeColor = [UIColor redColor].CGColor;
    } else
    {
        //跌,设置绿色
        layer.strokeColor = [UIColor greenColor].CGColor;
    }
    layer.fillColor = [UIColor clearColor].CGColor;

    return layer;
}

单、多条线

效果图:

线段

上图中的淡绿色、粉色、黄色线就是我们所要绘制的,这里再解释一下为什么标题是单、多条线,因为在有的K线指标中规定某一个值是用一条连续的线段表示;但有的指标数值中间会有无效值,那无效值就不会连接,这样的话这条线段就是不连续的,形成多条线。

其实在分时线绘制的时候,也说过如何绘制一条线,这里就不再赘述了,直接上代码:

单条线工具类:

/**
 生成单条线

 @param pointArr 坐标点数组
 @param lineColor 线颜色
 @return 返回线段图层
 */
+ (CAShapeLayer *)getSingleLineLayerWithPointArray:(NSArray *)pointArr lineColor:(UIColor *)lineColor
{
    UIBezierPath *path = [UIBezierPath getBezierPathWithPointArr:pointArr];

    CAShapeLayer *layer = [CAShapeLayer layer];
    layer.path = path.CGPath;
    layer.lineWidth = 1.f;
    layer.strokeColor = lineColor.CGColor;
    layer.fillColor = [UIColor clearColor].CGColor;

    return layer;
}

多条线工具类:

/**
 生成包含多条线的线段

 @param pointArr 坐标点数组
 @param lineColor 线颜色
 @return 返回线段图层
 */
+ (CAShapeLayer *)getMultipleLineLayerWithPointArray:(NSArray *)pointArr lineColor:(UIColor *)lineColor
{
    UIBezierPath *path = [UIBezierPath bezierPath];

    for (int idxX=0; idxX<pointArr.count; idxX++)
    {
        NSArray *idxXArr = pointArr[idxX];

        [path moveToPoint:[[idxXArr firstObject] CGPointValue]];
        for (int idxY=1; idxY<idxXArr.count; idxY++)
        {
            [path addLineToPoint:[idxXArr[idxY] CGPointValue]];
        }
    }

    CAShapeLayer *layer = [CAShapeLayer layer];
    layer.path = path.CGPath;
    layer.lineWidth = 1.f;
    layer.strokeColor = lineColor.CGColor;
    layer.fillColor = [UIColor clearColor].CGColor;

    return layer;
}

圆形

接下来是圆形,圆形就比较简单了,就是那么一个单纯的圆。只是在开发中,一般都是由多个圆形成一定的趋势。

这里直接上代码:

/**
 生成圆

 @param point 圆心坐标
 @param color 圆颜色
 @return 返回图层
 */
+ (CAShapeLayer *)getCircleLayerWithPoint:(CGPoint )point color:(UIColor *)color
{
    //直接用圆描述路径
    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:point radius:3.f startAngle:0.f
  endAngle:(CGFloat)M_PI * 2 clockwise:true];
    //生成图层 并设置路径和属性
    CAShapeLayer *layer = [CAShapeLayer layer];
    layer.path = path.CGPath;
    layer.fillColor = color.CGColor;
    layer.strokeColor = color.CGColor;

    return layer;
}

带状

这里要说明一下,带状这种图形用文字叙述不清楚,需要结合实际的数据才能理解。所以这里就先不写Demo,等到后面我们在框架中接入实际数据了,再详述。

绘制效果

上面光发代码了,这里把最后的运行结果发上来:

运行结果

需要源码的点击这里

没有更多推荐了,返回首页