Swift - 第三方图表库Charts使用详解1（安装配置、基本用法）

2018-07-18 发布：hangge 阅读：13221

一、基本介绍

1，什么是 Charts

（1）Charts 是一个功能强大的图表框架，使用 Swift 编写。可以将其看作是 Android 上大名鼎鼎的图表库 MPAndroidChart 在 iOS 上的移植。

（2）Charts 为我们提供了 8 种不同类型的图表：

LineChart：折线图
BarChart：柱状图
Combined-Chart：组合图
PieChart：饼状图
RadarChart：雷达图
ScatterChart：散点图
CandleStickChart：K 线图（烛形图）
BubbleChart：气泡图

2，功能特点

提供 8 种不同的图表类型。
支持在两个轴上的缩放（使用手势）
支持拖动/平移（使用手势）
支持多种类型的图表组合（折线图、柱状图、散点图、烛形图、气泡图）
支持双轴（互相独立）
支持定制 x 轴和 y 轴
支持突出显示某些值（使用可自定义的弹出视图）
支持将图表保存到相机胶卷，导出为 PNG / JPEG
支持预定义的颜色模板
支持图例（自动生成，可自定义）
支持动画（同样可以在 x 轴和 y 轴上构建动画）
支持限制线（用于提供额外信息，比如最大值，警戒线.....）
支持样式定制（字体，图例，颜色，背景，手势，虚线......）
支持直接从 Realm.io 移动数据库绘制数据

3，安装配置

（1）从 GitHub 上下载最新的代码：https://github.com/danielgindi/Charts

（2）将下载下来的源码包中 Charts.xcodeproj 拖拽至你的工程中

（3）工程 -> General -> Embedded Binaries 项，把 Charts.framework 添加进来。

（4）最后，在需要使用 Charts 的地方 import 进来就可以了。

import Charts

二、简单的测试样例

（1）下面我们使用 Charts 来显示一个简单的折线图，效果如下：

随机生成 20 条数据组成一个折线，并显示在图表中。
通过捏合手势可以进行 x 轴的缩放，放大后可左右拖动图表查看数据。
双击图表任意位置可放大该区域（x 轴、y 轴都放大），放大后可以上下左右拖动图表查看数据。

（2）样例代码

import UIKit
import Charts

class ViewController: UIViewController {
    
    //折线图
    var chartView: LineChartView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        //创建折线图组件对象
        chartView = LineChartView()
        chartView.frame = CGRect(x: 20, y: 80, width: self.view.bounds.width - 40,
                                 height: 300)
        self.view.addSubview(chartView)
        
        //生成20条随机数据
        var dataEntries = [ChartDataEntry]()
        for i in 0..<20 {
            let y = arc4random()%100
            let entry = ChartDataEntry.init(x: Double(i), y: Double(y))
            dataEntries.append(entry)
        }
        //这50条数据作为1根折线里的所有数据
        let chartDataSet = LineChartDataSet(values: dataEntries, label: "图例1")
        //目前折线图只包括1根折线
        let chartData = LineChartData(dataSets: [chartDataSet])

        //设置折现图数据
        chartView.data = chartData
    }
}