Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

一、基本用法
1,一个简单的样例
(1)效果图
下面随机生成 5 条数据组成饼状图。
点击某个扇区时该扇区会伸出显示。
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

(2)样例代码

import UIKit
import Charts

class ViewController: UIViewController {

//饼状图
var chartView: PieChartView!
 
override func viewDidLoad() {
    super.viewDidLoad()
     
    //创建饼图组件对象
    chartView = PieChartView()
    chartView.frame = CGRect(x: 20, y: 80, width: self.view.bounds.width - 40,
                             height: 260)
    self.view.addSubview(chartView)
     
    //生成5条随机数据
    let dataEntries = (0..<5).map { (i) -> PieChartDataEntry in
        return PieChartDataEntry(value: Double(arc4random_uniform(50) + 10),
                                 label: "数据\(i)")
    }
    let chartDataSet = PieChartDataSet(values: dataEntries, label: "数据分布")
    //设置颜色
    chartDataSet.colors = ChartColorTemplates.vordiplom()
        + ChartColorTemplates.joyful()
        + ChartColorTemplates.colorful()
        + ChartColorTemplates.liberty()
        + ChartColorTemplates.pastel()
    let chartData = PieChartData(dataSet: chartDataSet)
     
    //设置饼状图数据
    chartView.data = chartData
}

}

2,禁用图表旋转功能
默认情况下,我们可以使用手指转动饼图。如果不需要该功能,只需将 rotationEnabled 设置为 false 即可。
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

chartView.rotationEnabled = false //禁用旋转功能

3,修改选中扇区的伸出长度
注意:如果将 selectionShift 设置为 0,扇区点击后则不会变化。
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

chartDataSet.selectionShift = 5

4,设置饼图中央的标题文字
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

chartView.centerText = “我是饼状图”

5,带图标的扇区
下面样例在所有数值超过 40 的扇区中显示个星星图标。注意:为防止图标与文字重合,这里通过设置偏移量将图标显示在文字上方。
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

//生成5条随机数据
let dataEntries = (0…<5).map { (i) -> PieChartDataEntry in
let value = Double(arc4random_uniform(50) + 10)
//只要值超过80都会带有一个小图标
if value > 40 {
return PieChartDataEntry(value: value, label: “数据(i)”,
icon: UIImage(named: “icon”))
} else {
return PieChartDataEntry(value: value, label: “数据(i)”)
}
}
let chartDataSet = PieChartDataSet(values: dataEntries, label: “数据分布”)
chartDataSet.iconsOffset = CGPoint(x: -23, y: 0) //设置图标的偏移量

6,设置扇区间隔
默认情况下各个扇区是相互紧挨着的,我们可以对其设置个间隔距离。
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

chartDataSet.sliceSpace = 3 //扇区间隔为3

7,修改字体样式和颜色。
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

chartData.setValueFont(.systemFont(ofSize: 11, weight: .light)) //字体修改
chartData.setValueTextColor(.red) //颜色修改

8,数值格式化显示
(1)在数值前面添加一个美元符号($)
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

let formatter = NumberFormatter() //自定义格式
formatter.positivePrefix = “$” //数字前缀单位
chartData.setValueFormatter(DefaultValueFormatter(formatter: formatter))

(2)将数值转换成百分占比显示(百分比形式)
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

//将数值转化为百分比
chartView.usePercentValuesEnabled = true

//数值百分比格式化显示
let pFormatter = NumberFormatter()
pFormatter.numberStyle = .percent
pFormatter.maximumFractionDigits = 1
pFormatter.multiplier = 1
pFormatter.percentSymbol = “%”
chartData.setValueFormatter(DefaultValueFormatter(formatter: pFormatter))

9,不显示数值
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

chartDataSet.drawValuesEnabled = false

10,设置空心部分的样式
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

chartView.holeRadiusPercent = 0.382 //空心半径黄金比例
chartView.holeColor = UIColor.black //空心颜色设置为灰色
chartView.transparentCircleRadiusPercent = 0.5 //半透明空心半径

11,显示实心饼图
(1)中央部分仍然保持半透明
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

chartView.holeRadiusPercent = 0 //空心半径为0
chartView.transparentCircleRadiusPercent = 0.25 //半透明半径比例

(2)完全实心显示
原文:Swift - 第三方图表库Charts使用详解21(饼状图1:基本用法)

chartView.drawHoleEnabled = false //这个饼是实心的

原文链接:https://www.hangge.com/blog/cache/detail_2162.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值