Swift - 第三方图表库Charts使用详解15(柱状图2:正负柱状图、横向条形图)
程序员文章站
2024-03-23 12:19:10
...
二、正负柱状图
1,效果图
柱状图是可以同时显示正值和负值数据的。同时这里做个功能改进,根据正负情况显示相应颜色:
正值的柱子显示为绿色。
负值的柱子显示为红色。
2,样例代码
import UIKit
import Charts
class ViewController: UIViewController {
//柱状图图
var chartView: BarChartView!
override func viewDidLoad() {
super.viewDidLoad()
//创建折线图组件对象
chartView = BarChartView()
chartView.frame = CGRect(x: 20, y: 80, width: self.view.bounds.width - 40,
height: 260)
self.view.addSubview(chartView)
//生成10条随机数据
var dataEntries = [BarChartDataEntry]()
for i in 0..<10 {
let y = Double(arc4random() % 100) - 50
let entry = BarChartDataEntry(x: Double(i), y: y)
dataEntries.append(entry)
}
//根据正负值生成每个立柱使用的颜色
let red = UIColor(red: 211/255, green: 74/255, blue: 88/255, alpha: 1)
let green = UIColor(red: 110/255, green: 190/255, blue: 102/255, alpha: 1)
let colors = dataEntries.map { (entry) -> NSUIColor in
return entry.y > 0 ? green : red
}
//这10条数据作为柱状图的所有数据
let chartDataSet = BarChartDataSet(values: dataEntries, label: "图例1")
//设置颜色
chartDataSet.colors = colors
//目前柱状图只包括1组立柱
let chartData = BarChartData(dataSets: [chartDataSet])
//设置柱状图数据
chartView.data = chartData
}
}
三、横向条形图
1,只包含正值的条形图
如果要显示水平柱状图,只需要把 BarChartView 换成 HorizontalBarChartView 即可。
import UIKit
import Charts
class ViewController: UIViewController {
//横向柱状图
var chartView: HorizontalBarChartView!
override func viewDidLoad() {
super.viewDidLoad()
//创建柱状图组件对象
chartView = HorizontalBarChartView()
chartView.frame = CGRect(x: 20, y: 80, width: self.view.bounds.width - 40,
height: 260)
self.view.addSubview(chartView)
//不显示图例
chartView.legend.enabled = false
//x轴显示在左侧
chartView.xAxis.labelPosition = .bottom
//y轴起始刻度为0
chartView.leftAxis.axisMinimum = 0
chartView.rightAxis.axisMinimum = 0
//生成10条随机数据
var dataEntries = [BarChartDataEntry]()
for i in 0..<10 {
let y = arc4random()%100
let entry = BarChartDataEntry(x: Double(i), y: Double(y))
dataEntries.append(entry)
}
//这10条数据作为柱状图的所有数据
let chartDataSet = BarChartDataSet(values: dataEntries, label: "图例1")
//目前柱状图只包括1组立柱
let chartData = BarChartData(dataSets: [chartDataSet])
//设置柱状图数据
chartView.data = chartData
chartView.fitScreen()
}
}
2,同时包含正负值的条形图
这个和最开始的样例差不多,只不过之前是纵向显示,这次变成横向显示。
import UIKit
import Charts
class ViewController: UIViewController {
//横向柱状图
var chartView: HorizontalBarChartView!
override func viewDidLoad() {
super.viewDidLoad()
//创建柱状图组件对象
chartView = HorizontalBarChartView()
chartView.frame = CGRect(x: 20, y: 80, width: self.view.bounds.width - 40,
height: 260)
self.view.addSubview(chartView)
//不显示图例
chartView.legend.enabled = false
//x轴显示在左侧
chartView.xAxis.labelPosition = .bottom
//生成10条随机数据
var dataEntries = [BarChartDataEntry]()
for i in 0..<10 {
let y = Double(arc4random() % 100) - 50
let entry = BarChartDataEntry(x: Double(i), y: y)
dataEntries.append(entry)
}
//根据正负值生成每个立柱使用的颜色
let red = UIColor(red: 211/255, green: 74/255, blue: 88/255, alpha: 1)
let green = UIColor(red: 110/255, green: 190/255, blue: 102/255, alpha: 1)
let colors = dataEntries.map { (entry) -> NSUIColor in
return entry.y > 0 ? green : red
}
//这10条数据作为柱状图的所有数据
let chartDataSet = BarChartDataSet(values: dataEntries, label: "图例1")
//设置颜色
chartDataSet.colors = colors
//目前柱状图只包括1组立柱
let chartData = BarChartData(dataSets: [chartDataSet])
//设置柱状图数据
chartView.data = chartData
chartView.fitScreen()
}
}
原文出自:www.hangge.com 原文链接:https://www.hangge.com/blog/cache/detail_2153.html
下一篇: 《加密与解密》笔记四(一)