[Swift通天遁地]三、手势与图表-(11)制作雷达图表更加形象表示各个维度的情况

本文将演示如何创建雷达图表更加形象表示各个维度的情况。

首先确保在项目中已经安装了所需的第三方库。

点击【Podfile】,查看安装配置文件。

1 platform :ios,‘12.0‘
2 use_frameworks!
3 
4 target ‘DemoApp‘ do
5     source ‘https://github.com/CocoaPods/Specs.git‘
6     pod ‘Charts‘
7 end

根据配置文件中的相关配置，安装第三方库。

然后点击打开【DemoApp.xcworkspace】项目文件。

为了更好的显示柱形图标需要调整模拟器的朝向。

【DemoApp】->【General】

->【Device Orientation】取消勾选【Portrait】肖像选项，使模拟器保持横向显示。

在项目导航区，打开视图控制器的代码文件【ViewController.swift】

 1 import UIKit
 2 //首先在当前的类文件中，引入已经安装的第三方类库
 3 import Charts
 4 
 5 class ViewController: UIViewController {
 6 
 7     override func viewDidLoad() {
 8         super.viewDidLoad()
 9         // Do any additional setup after loading the view,typically from a nib.
10         
11         //依次创建两个包含6个数字的数组，作为雷达图表的数据源
12         let values1: [Double] = [58,61,81,93,52,44]
13         let values2: [Double] = [96,79,60,63,82,77]
14         
15         //依次创建三个图表数据记录
16         var entries1: [ChartDataEntry] = Array()
17         var entries2: [ChartDataEntry] = Array()
18         
19         //通过一个循环
20         for (_,value) in values1.enumerated()
21         {
22             //将第一个数组中的数字，添加到图表数据记录中。
23             entries1.append(RadarChartDataEntry(value: value))
24         }
25         
26         //通过一个循环
27         for (_,value) in values2.enumerated()
28         {
29             //将第二个数组中的数字，添加到图表数据记录中。
30             entries2.append(RadarChartDataEntry(value: value))
31         }
32         
33         //创建第一个数据集，并设置数据集的值域和标签文字
34         let dataSet = RadarChartDataSet(values: entries1,label: "Company A")
35         //设置数据集的颜色为绿色
36         dataSet.setColor(NSUIColor.green)
37         //设置数据集的边缘宽度为5
38         dataSet.linewidth = 5
39         //设置数据集的填充颜色为绿色
40         dataSet.fillColor = NSUIColor.green
41         //设置数据集的填充颜色的透明度为半透明
42         dataSet.fillAlpha = 0.5
43         //设置数据集的允许绘制数据集的填充属性
44         dataSet.drawFilledEnabled = true
45         
46         //创建第二个数据集，并设置数据集的值域和标签文字
47         let dataSet2 = RadarChartDataSet(values: entries2,label: "Company B")
48         //设置数据集的颜色为橙色
49         dataSet2.setColor(NSUIColor.orange)
50         //设置数据集的边缘宽度为5
51         dataSet2.linewidth = 5
52         //设置数据集的填充颜色为橙色
53         dataSet2.fillColor = NSUIColor.orange
54         //设置数据集的填充颜色的透明度为半透明
55         dataSet2.fillAlpha = 0.5
56         //设置数据集的允许绘制数据集的填充属性
57         dataSet2.drawFilledEnabled = true
58         
59         //创建一个指定显示区域的雷达图表视图
60         let chart = RadarChartView(frame: CGRect(x: 0,y: 40,width: 320,height: 480))
61         //设置图表视图的背景颜色为无色
62         chart.backgroundColor = NSUIColor.clear
63         //设置雷达图表所显示的数据内容
64         chart.data = RadarChartData(dataSets: [dataSet,dataSet2])
65         //设置水平坐标轴的标签位置位于底部
66         //共有：顶部、底部、双侧、顶部内侧、底部内侧五种。
67         chart.xAxis.labelPosition = .bottom
68         //设置图表的描述信息
69         chart.chartDescription?.text = "strengthen"
70         //设置图表图例的位置在图表的右侧
71         chart.legend.horizontalAlignment = .right
72         
73         //将配置好的图表添加到根视图中
74         self.view.addSubview(chart)
75     }
76 
77     override func didReceiveMemoryWarning() {
78         super.didReceiveMemoryWarning()
79         // dispose of any resources that can be recreated.
80     }
81 }