1 min to read

Charts 使用经验总结

Charts 使用经验总结

Charts 简介

以下是Charts库在github上的介绍

Beautiful charts for iOS/tvOS/OSX! The Apple side of the crossplatform MPAndroidChart.

简而言之，Charts是一个用于在iOS开发中绘制各种图表的第三方库，可以看作是一种数据可视化工具。该库基于Android平台上的MPAndroidChart移植而来。

为什么使用Charts

最近去面试iOS开发，于是想起来折腾一下之前大三移动开发课里尚未开发完整的一款小app。该app为一个调查问卷式小应用，主要功能为采集使用者的回答数据，并且在问卷结束后显示结果报告。结果报告包含两种形式，一种是基于之前刚刚结束的单次会话中的单张问卷，显示该问卷中使用者对每个问题的回答。另一种是基于目前为止所有问卷数据的汇总，当时作业要求用图表形式显示统计数据，不过自己当时由于种种原因未能完成改部分的开发，回想一下可能是因为当时对iOS开发涉及得不够深入导致对使用第三方库有所顾忌，以及自己对自身有限的开发能力的不自信。最近正好趁面试复习的机会，重新拾起该app的开发。

如何将Charts 整合到项目

在Charts的github主页上提供了三种方式: 手动添加、通过Carthage添加和通过CocoaPods添加。这里省略Carthage这个方式，只覆盖CocoaPods和手动添加这两种。

  1. CocoaPods
    具体步骤： 1. 在项目根目录创建Podfile，在该文件内指定导入Charts库。 2. 打开终端，切换至项目根目录，运行pod install 3. 关闭所有项目相关窗口，打开项目目录内新增的.xcworkspace文件 4. 在需要使用到Charts库的源文件内添加: import Charts，位置在源文件的开头
    2. 手动添加

最后个人是用了CocoaPods来添加Charts库，因为手动添加时遇到了一些原因不明的问题，像是编译时遇到的。用CocoaPods的话让人省心不少。

实战：根据已有数据创建视图（柱状图和饼图）

由于图表要显示的数据基于对现有数据的汇总，那么这些数据必然已经经过持久化存储。在调查问卷App中。每个问题的汇总数据都通过Core Data持久化到本地。所以第一步是提取数据，这里仅仅指第一问的数据，故图表也仅反映第一问的回答情况。（注：此处省略在storyboard中创建界面，创建对应的ViewController等步骤）。在以创建好的ViewController里创建fetchQ1Results() -> NSManagedObject函数并将数据提取的相关逻辑添加到该方法中。
接下来在该类中创建两个方法：barChartUpdate()和pieChartUpdate()，先不添加方法体，在viewDidLoad()函数中分别调用这两个函数。随后先实现barChartUpdate()。这里讨论一下3个levels的概念。在Charts中，图表中的数据点与实际数据之间存在3个levels，level 1是表示单个数据点的Entry对象，这些对象会被包含在Dataset对象中，亦即level 2，最后Dataset对象会被Data对象所容纳，即为level 3。 有了上述的levels作为基础，然后要做的就是将目标数据添加到这些level里面。首先是DataEntry。通过下面的代码创建一个DataEntry对象:
let entry = BarChartDataEntry(x: Double, y: Double)
以此为蓝本将所有相关对象创建好。接下来创建一个数组来存储先前创建的DataEntry对象，并将该数组作为实参传递至DataSet的构造函数，具体代码为
let dataset = BarChartDataSet(values: [ChartDataEntry]?, label: String?)

最后一步是创建Data对象。具体代码为：
let data = BarChartData(dataSets: [IChartDataSet]?)
由于这里只涉及到一个DataSet，因此构造函数的形参[IChartDataSet]?的实际值应为[dataset],即一个只包含dataset这个元素的数组。
最后将data与即将创建的柱状图之间建立关联：
barChart.data = data
到这里数据和图表的绑定就完成了。接着对直方图的一些属性进行设置，比如标题、背景色、坐标轴文字字体和颜色、标题位置、动画等等。最后要在方法末尾调用notifyDataSetChanged()方法，对象为barChart。该方法提示渲染器此时应该使用已更新过的数据绘制柱状图。
至此与柱状图有关的代码实现完毕。与其对应的饼图方法pieChartUpdate()的实现与之类似，不过稍有不同。主要是由于饼图在形式上不包含坐标轴，因此PieChartEntry的构造函数的参数中只有一个数值，另一个为标签。

更深入探索Charts的一些方向

更多阅读

  1. csdn博客 - Swift-Charts 多种样式图表-详细
  2. GitHub - danielgindi-Charts