iOS Charts制作图表

最终效果

要实现的效果

使用第三方框架 Charts

主要是一些参数设置

//x轴方向 默认上方
lineChartView.xAxis.labelPosition = .bottom
//自定义标签刻度
lineChartView.xAxis.valueFormatter = IndexAxisValueFormatter(values: dataPoints)
//设置虚线
lineChartView.xAxis.gridLineDashLengths = [4,2]
//不绘制y轴右侧文字
lineChartView.rightAxis.drawLabelsEnabled = false
lineChartView.leftAxis.axisLineWidth = 2 //左Y轴宽度
lineChartView.leftAxis.axisLineColor = .black//左Y轴颜色
lineChartView.xAxis.axisLineWidth = 2 //x轴宽度
lineChartView.xAxis.axisLineColor = .black //x轴颜色
效果

对xy轴进行一些操作

chartView.leftAxis.axisMinimum = -100 //最小刻度值
chartView.leftAxis.axisMaximum = 100 //最大刻度值
chartView.leftAxis.granularity = 50 //最小间隔
//y轴无网格线
lineChartView.leftAxis.drawGridLinesEnabled = false //不绘制网格线
//不开启十字线
chartDataSet.highlightEnabled = false
chartDataSet.drawFilledEnabled = true //开启填充色绘制
chartDataSet.fillColor = .orange  //设置填充色
chartDataSet.fillAlpha = 0.5 //设置填充色透明度

//开启填充色绘制
chartDataSet.drawFilledEnabled = true
//渐变颜色数组
let gradientColors = [UIColor.orange.cgColor, UIColor.white.cgColor] as CFArray
//每组颜色所在位置(范围0~1)
let colorLocations:[CGFloat] = [1.0, 0.0]
//生成渐变色
let gradient = CGGradient.init(colorsSpace: CGColorSpaceCreateDeviceRGB(),
                               colors: gradientColors, locations: colorLocations)
//将渐变色作为填充对象s
chartDataSet.fill = Fill.fillWithLinearGradient(gradient!, angle: 90.0)
//不显示图例头部
chartView.legend.form = .none
效果

添加背景颜色的话,只有矩形里面有颜色,所以要给整个加颜色,我们在外面加一个view设置颜色
同时要保证,这个图表是这个view的子view,否则会被覆盖
然后要设置图标背景颜色为透明


效果

未解决的问题:

这里的初始点是通过给了一个值来实现的,如何让他不显示第一个和最后一个值
y轴的初始值130怎么去掉
曲线上的值为double如何不显示小数点
怎么给y轴添加单位

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容