一个很好的图表制作第三方框架的使用:Charts
创建折线图 lineChartView,创建如下图的效果
-
初始化折线图,并进行配置
let lineChartView = LineChartView().then {
$0.noDataText = "暂无统计数据"
$0.chartDescription?.enabled = false //是否显示描述
$0.drawGridBackgroundEnabled = true
let xAxisFormatter = NumberFormatter()
xAxisFormatter.minimumFractionDigits = 0
xAxisFormatter.maximumFractionDigits = 1
xAxisFormatter.negativePrefix = "月"
xAxisFormatter.positiveSuffix = "月"
//chart设置,x轴设置
let xAxis = $0.xAxis
xAxis.labelPosition = .bottom //x轴的位置
xAxis.labelFont = .systemFont(ofSize: 10)
xAxis.drawGridLinesEnabled = false
xAxis.granularity = 1.0
// xAxis.labelCount = 12
xAxis.valueFormatter = DefaultAxisValueFormatter(formatter: xAxisFormatter)
$0.leftAxis.drawGridLinesEnabled = false //左侧y轴设置,不画线
$0.leftAxis.axisMinimum = 0.0 //最小数据
$0.rightAxis.drawGridLinesEnabled = false //右侧y轴设置,不画线
$0.rightAxis.axisMinimum = 0.0
$0.legend.enabled = true //下方的说明
let legend = $0.legend
legend.horizontalAlignment = .left
legend.verticalAlignment = .bottom
legend.orientation = .horizontal
legend.drawInside = false
legend.form = .square
legend.formSize = 9.0
legend.font = .systemFont(ofSize: 10)
legend.xEntrySpace = 4.0
}
-
添加到视图
self.view.addSubview(self.lineChartView)
self.lineChartView.snp.makeConstraints {
$0.centerX.equalToSuperview()
$0.width.height.equalTo(screeW-20)
$0.top.equalTo(self.segcontrol.snp.bottom).offset(10)
}
self.setLineChartViewData(withModel: self.model)
-
设置折线图的数据
/// 设置折线图的数据
///
/// - Parameter model: 数据
func setLineChartViewData(withModel model: ChartModels) {
let charArray = model.chatDatas
var dataEntris = [ChartDataEntry]()
for chart in charArray {
let dataEntry = ChartDataEntry(x: Double(chart.month), y: Double(chart.count))
dataEntris.append(dataEntry)
}
let set = LineChartDataSet(values: dataEntris, label: "发布数/月份")
set.drawIconsEnabled = true
//虚线
// set.lineDashLengths = [5.0, 2.5]
// set.highlightLineDashLengths = [5.0, 2.5]
set.setColor(NavbarColor)
set.setCircleColor(.black)
set.lineWidth = 1.0
set.circleRadius = 3.0
//legend 的一些设置,标记大小,字体等,在初始化的时候进行了设置
// set.valueFont = .systemFont(ofSize: 10)
// set.formLineDashLengths = [5.0, 2.5]
// set.formLineWidth = 1.0
// set.formSize = 15.0
//填充色
// let gradientColors = [ChartColorTemplates.colorFromString("#00ff0000").cgColor, NavbarColor.cgColor]
// let gradient = CGGradient(colorsSpace: nil, colors: gradientColors as CFArray, locations: nil)
//
// set.fillAlpha = 1.0
// set.fill = Fill.fillWithLinearGradient(gradient!, angle: 90)
set.drawFilledEnabled = false
// CGGradientRelease(gradient);
let data = LineChartData(dataSet: set)
self.lineChartView.data = data
self.lineChartView.animate(xAxisDuration: 1.0, yAxisDuration: 1.0, easingOption: .easeInBack)
}