关于charts的系列视图介绍传送门:

iOS 图表工具charts介绍

iOS 图表工具charts之LineChartView

iOS 图表工具charts之BarChartView

iOS 图表工具charts之PieChartView

iOS 图表工具charts之CandleStickChartView

iOS 图表工具charts之CombinedChartView

CombinedChartView在charts中可以用来绘制组合图,即前面介绍的所有图标的组合形态,通过CombinedChartView可以设置各种图表的图层,由于charts是基于swift开发的,如果需要和objective-C混编(通过pod的方式不用管),可以参考我的上几篇文章iOS OC中桥接swift第三方库》,这里主要讲的是CombinedChartView的一些常用属性和一些基本用法,实际情况以开发为准

关于K线,我们知道K线能反应一只股票的实时状态以及涨跌幅度的一种图表,K线主要是又4组数组组成的,分别是开盘价,收盘价,最高价,最低价



K线上面的每根柱子都是有这4组数据按照一定的比例画出来的,charts中就提供了一种绘制k线的视图,CombinedChartView,我们如果需要画出k线柱子,只需要传入这4个价格即可,对应的红色还是绿色可以自行设置红涨绿跌或者绿涨红跌

组合图可以包含之前介绍的所有图表,这些图表能够同时显示在CombinedChartView中,在CombinedChartView中可以通过drawOrder来设置层级关系

    //设置层级
chartView.drawOrder = @[
@(CombinedChartDrawOrderBar),
@(CombinedChartDrawOrderBubble),
@(CombinedChartDrawOrderCandle),
@(CombinedChartDrawOrderLine),
@(CombinedChartDrawOrderScatter)
];

CombinedChartView的属性基本同之前介绍的属性差不多,有需要的可以回到前面几篇文章查看,基本都是一些缩放比例,显示个数,图例,捏合手势,是否滚动,是否网格,label个数,字体大小颜色线宽,xAxis,leftAxis,RightAxis等等,前面都已经介绍的很详细了,这里就不在累述了

给CombinedChartView赋值

    CombinedChartData *chartData = [[CombinedChartData alloc] init];
chartData.candleData = candleData;
chartData.lineData = lineData;
chartData.barData = barData;
self.chartView.data = chartData;

我们需要做的就是分别根据datas初始化对应的candleData,lineData,barData数据了

关于怎么创建candleData请参考iOS 图表工具charts之CandleStickChartView

关于怎么创建lineData请参考iOS 图表工具charts之LineChartView

关于怎么创建barData请参考iOS 图表工具charts之BarChartView

创建完数据之后直接将数据赋值给CombinedChartData即可,这里lineData,barData,candleData可以为nil,但是呢不能全部为nil,如果这些数据全部为nil可以设置self.chartView.data=nil,而不要self.chartView.data = chartData(chartData至少有一组数据是可行的,否则会崩溃); 还有lineData是可以放多条线的,之前讲lineChartView的时候应该是有讲过的,如果记不清了,请回头看一下,谢谢

一个完整的k线是有上半边k线图(chartView),和下半边指数图组成的(subChartView),需要注意的

1.滚动一般都是同步的,也是上边的chartView滚动,下边的subChartView也要跟着滚动

#pragma mark 图表被移动
-(void)chartTranslated:(ChartViewBase *)chartView dX:(CGFloat)dX dY:(CGFloat)dY{
CGAffineTransform srcMatrix = chartView.viewPortHandler.touchMatrix;
[self.chartView.viewPortHandler refreshWithNewMatrix:srcMatrix chart:self.chartView invalidate:YES];
[self.subChartView.viewPortHandler refreshWithNewMatrix:srcMatrix chart:self.subChartView invalidate:YES];
}

2.缩放是同步的,初始缩放比例,最大缩放比例,实时缩放比例必须是同步的

#pragma mark 图表被缩放
-(void)chartScaled:(ChartViewBase *)chartView scaleX:(CGFloat)scaleX scaleY:(CGFloat)scaleY{
CGAffineTransform srcMatrix = chartView.viewPortHandler.touchMatrix;
[self.chartView.viewPortHandler refreshWithNewMatrix:srcMatrix chart:self.chartView invalidate:YES];
[self.subChartView.viewPortHandler refreshWithNewMatrix:srcMatrix chart:self.subChartView invalidate:YES];
}

3.点击了实时显示当前选中值的价格面板,找到选中的model,并将model传递出去

//k线代理方法
-(void)chartValueSelected:(ChartViewBase *)chartView entry:(ChartDataEntry *)entry highlight:(ChartHighlight *)highlight{
NSInteger index = highlight.x;
//index为当前选中的x值
if(index < self.datas.count){
//根据当前的index能拿到对应的数据模型
Model *model = self.datas[index];
}
}

4.CombinedChartView显示组合图的时候会出现第一个和最后一个图会显示一半(显示不全),如果你遇到这样的问题,下面这种方法可以解决你的问题

=

参考github Charts issues:https://github.com/danielgindi/Charts/issues/2106

    ChartXAxis *xAxis = chartView.xAxis;
//这个很重要 可以解决显示半个bar的bug
xAxis.spaceMin = 0.5;
xAxis.spaceMax = 0.5;

5.画折线

      UIColor *color = colors[idx];
[set setColor:color];
set.lineWidth = 0.5;
set.drawCirclesEnabled = NO;
set.drawValuesEnabled = NO;
set.axisDependency = AxisDependencyRight;
set.highlightEnabled = NO;
set.drawHorizontalHighlightIndicatorEnabled = NO;
set.drawVerticalHighlightIndicatorEnabled = NO;
set.mode = LineChartModeLinear;

6.画空心线

       [set setColor:[UIColor clearColor]];
set.lineWidth = 0.5;
set.drawCirclesEnabled = YES;
set.circleRadius = 2.5f;
set.circleColors = @[UIColor.redColor];
set.circleHoleColor = [UIColor clearColor];
set.circleHoleRadius = 2.0f;
set.drawCircleHoleEnabled = YES;
set.lineDashPhase = .5f;
set.lineDashLengths = @[@.5f];
set.drawValuesEnabled = NO;
set.axisDependency = AxisDependencyRight;
set.highlightEnabled = NO;
set.drawHorizontalHighlightIndicatorEnabled = NO;
set.drawVerticalHighlightIndicatorEnabled = NO;
set.mode = LineChartModeLinear;

7.柱状图

       BarChartDataSet *set = [[BarChartDataSet alloc] initWithEntries:entrys label:setName];
//设置set属性
set.axisDependency = AxisDependencyRight;
set.formLineWidth = 5;
set.highlightEnabled = NO;
[set setColors:colors];
[data addDataSet:set];

8.K线

   CandleChartDataSet *set = [[CandleChartDataSet alloc] initWithEntries:array label:@"kLine DataSet"];
//下降颜色 是否填充填充
set.decreasingColor = UIColorHex(0x32BE89);
set.decreasingFilled = YES;
//上升颜色 是否填充填充
set.increasingColor = UIColorHex(0xFD4C60);
set.increasingFilled = YES;
//显示美国线
//set.showCandleBar = NO;
//阴影线的宽度 颜色跟随
set.shadowWidth = 0.7;
set.shadowColorSameAsCandle = YES;
//k线柱间隙
set.barSpace = 0.15;
//是否现在十字标识
set.drawHorizontalHighlightIndicatorEnabled = NO;
set.drawVerticalHighlightIndicatorEnabled = NO;
//轴线方向
set.axisDependency = AxisDependencyRight;
//不显数字
set.drawValuesEnabled = NO;

9.有时候可以画一些透明的线用来占位置

    //set
LineChartDataSet *lineSet = [[LineChartDataSet alloc] initWithEntries:listEntry label:@"Line DataSet x"];
[lineSet setColor:UIColor.clearColor];
lineSet.drawValuesEnabled = NO;
lineSet.drawCirclesEnabled = NO;
lineSet.drawHorizontalHighlightIndicatorEnabled = NO;
lineSet.drawVerticalHighlightIndicatorEnabled = NO;
//不可以被点击
lineSet.highlightEnabled = NO;

10.其他关于K线需要注意的点请参考iOS 图表工具charts之CandleStickChartView中需要注意的点

11.如果指标图为MACD的情况下,需要保证bar的个数和K线的bar个数一样多,都在会出现上下两个bar中心点不一样的情况 如果不同可以使用填充数据的方式,让后填充的数据用透明颜色

其他待续

转载请标注来源:https://www.cnblogs.com/qqcc1388/

iOS 图表工具charts之CombinedChartView的更多相关文章

  1. iOS 图表工具charts之CandleStickChartView(K线)

    关于charts的系列视图介绍传送门: iOS 图表工具charts介绍 iOS 图表工具charts之LineChartView iOS 图表工具charts之BarChartView iOS 图表 ...

  2. iOS 图表工具charts之PieChartView

    关于charts的系列视图介绍传送门: iOS 图表工具charts介绍 iOS 图表工具charts之LineChartView iOS 图表工具charts之BarChartView iOS 图表 ...

  3. iOS 图表工具charts之BarChartView

    关于charts的系列视图介绍传送门: iOS 图表工具charts介绍 iOS 图表工具charts之LineChartView iOS 图表工具charts之BarChartView iOS 图表 ...

  4. iOS 图表工具charts之LineChartView

    关于charts的系列视图介绍传送门: iOS 图表工具charts介绍 iOS 图表工具charts之LineChartView iOS 图表工具charts之BarChartView iOS 图表 ...

  5. iOS 图表工具charts介绍

    charts是一个很好的绘图工具,功能非常强大,可以用来绘制折线,柱状图,饼状图,k线图,k线分时图,雷达图,气泡图等等,charts是一款仿照安卓 MPAndroidChart而来的一个基于swif ...

  6. JHChart 1.1.0 iOS图表工具库中文ReadMe

    JHChart(最新版本1.1.0) 好吧,的确当前的github上已经存有不少的iOS图表工具库,然而,当公司的项目需要图表时,几乎没有哪个第三方能够完全满足我的项目需求.无奈之下,本人不得不花费一 ...

  7. JHChart iOS图表工具库1.0.3新版本详解

    前言. 从2016年4月14日开始,本人着手开发了JHChart图表工具库.经过断断续续的开发,截止到现在,已经实现了折线图.柱状图.饼状图.环形图和表格样式的图表功能.为了方便使用,我已经将一个简单 ...

  8. iOS图表库Charts集成与使用

    Charts是一个很优秀的图表库,它支持Android.iOS.tvOS和macOS,这样使用起来,可以节省学习成本,可以从GitHub上了解更多信息.本文记录在iOS项目上的集成与使用. Chart ...

  9. .net图表工具汇总

    概述:图形图表的可视化数据表现形式已成为一种趋势,本文推荐了10款非常好用的.NET图表控件,希望对广大.NET图表开发者能有所帮助. 读图时代,图形图表的可视化数据表现形式已成为一种趋势.因为图表能 ...

随机推荐

  1. ps aux详解(进程状态说明)

    linux上进程有5种状态: 1. 运行(正在运行或在运行队列中等待) 2. 中断(休眠中, 受阻, 在等待某个条件的形成或接受到信号) 3. 不可中断(收到信号不唤醒和不可运行, 进程必须等待直到有 ...

  2. VMware虚拟化集群的配置(一)

    一.VMware介绍 VMware vSphere 是业界领先且最可靠的虚拟化平台.vSphere将应用程序和操作系统从底层硬件分离出来,从而简化了 IT操作. VMware集群最主要的两个部分ESX ...

  3. c++的并发操作(多线程)

    C++11标准在标准库中为多线程提供了组件,这意味着使用C++编写与平台无关的多线程程序成为可能,而C++程序的可移植性也得到了有力的保证.另外,并发编程可提高应用的性能,这对对性能锱铢必较的C++程 ...

  4. 线程池ThreadPool

    在面向对象编程中,经常会面对创建对象和销毁对象的情况,如果不正确处理的话,在短时间内创建大量对象然后执行简单处理之后又要销毁这些刚刚建立的对象,这是一个非常消耗性能的低效行为,所以很多面向对象语言中在 ...

  5. 安装theano时候发现报错:cannot install ''numpy'.It is a distutils installed project and thus we cannot ...

    发现我安装theano的时候需要numpy需要1.9以上版本,而我之前自带的numpy是1.8版本,所以版本有问题.根本原因是theano需要的numpy版本不符合要求,但是numpy已经安装过了,所 ...

  6. 【CF1187C】Vasya And Array

    题目大意:给定一个长度为 N 的数组,以及 M 个区间,给出的区间有两个性质,性质一是给定区间中的元素单调不减,性质二是给定区间中的元素存在相邻单调减的元素对,求构造一个符合给定区间条件的序列,若不存 ...

  7. Java程序员必备的一些流程图

    Java程序员必备的一些流程图 转自https://juejin.im/post/5d214639e51d4550bf1ae8df 前言: 整理了一些Java基础流程图/架构图,做一下笔记,大家一起学 ...

  8. Acwing-280-陪审团(背包dp?)

    链接: https://www.acwing.com/problem/content/282/ 题意: 在一个遥远的国家,一名嫌疑犯是否有罪需要由陪审团来决定. 陪审团是由法官从公民中挑选的. 法官先 ...

  9. HTML新手入门(1)

    HTML新手入门(1) ——编译器下载及基础框架 一.编译器下载 作为新手,听取大佬的建议,用HBuilder进行编译. 下载地址:www.dcloud.io/ 进入到首页左上角有一个如下图标. (这 ...

  10. jquery的checked

    目前使用的jQuery版本为 v1.11.2 jquery判断checked的三种方法: .attr('checked'):   //看版本1.6+返回:"checked"或&qu ...