首先祭出此控件的网站https://github.com/kevinzhow/PNChart;
最近公司的项目中有使用到原生的柱状图,然而自己封装的图在大量数据面前竟然怂了,一划一卡,如此的不流畅,对于一个处女座的iOS程序员来说是很糟心的事情啊。索性在网上搜索了会发现两个不错的图标框架,Charts和PNChart前者适合Swift(当然也可以将它桥接到OC,不过个人感觉这样的方法很鸡肋)后者有Swift和OC版。那当然选择后者啦。 下面开始导入此框架 方法一:简单粗暴直接 pod install 具体方法参照github上的说明 方法二:手动导入,此处有点坑,当我习惯性的将PNChart-master解压后其中的中的PNChart拖到工程中时。编译。。。竟然报错:主要是#import"PNRadarChartDataItem.h"
中的问题于是乎搜索了一番找到了个解决方案:首先登陆全球最大的同性交友网站github搜索到UICountingLabel解压后把UICountingLabel的.m和.h文件拖入工程然后 把报错的#import<UICountingLabel/UICountingLabel.h>
头文件换为#import"UICountingLabel.h"再次编译,完全没有问题。 开始使用: 首先当然是引入头文件啦,在需要用到图表的地方引入#import"PNChart.h"
然后参照官方的demo
self.barChart = [[PNBarChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];
// self.barChart.showLabel = NO;
self.barChart.yLabelFormatter = ^(CGFloat yValue) {
return [barChartFormatter stringFromNumber:@(yValue)];
};
self.barChart.yChartLabelWidth = 20.0;
self.barChart.chartMarginLeft = 30.0;
self.barChart.chartMarginRight = 10.0;
self.barChart.chartMarginTop = 5.0;
self.barChart.chartMarginBottom = 10.0;
self.barChart.labelMarginTop = 5.0;
self.barChart.showChartBorder = YES;
[self.barChart setXLabels:@[@"2", @"3", @"4", @"5", @"2", @"3", @"4", @"5"]];
// self.barChart.yLabels = @[@-10,@0,@10];
// [self.barChart setYValues:@[@10000.0,@30000.0,@10000.0,@100000.0,@500000.0,@1000000.0,@1150000.0,@2150000.0]];
[self.barChart setYValues:@[@10.82, @1.88, @6.96, @33.93, @10.82, @1.88, @6.96, @33.93]];
[self.barChart setStrokeColors:@[PNGreen, PNGreen, PNRed, PNGreen, PNGreen, PNGreen, PNRed, PNGreen]];
self.barChart.isGradientShow = NO;
self.barChart.isShowNumbers = NO;
[self.barChart strokeChart];
self.barChart.delegate = self;
[self.view addSubview:self.barChart];
复制代码
然而当运行出来时发现 X坐标呢? X坐标的数据去哪了 找了找发现是demo中的self.barChart.labelMarginTop = 5.0;
问题,修改即可。
随后将控件正式封装到工程中 然而
这是什么鬼 还能不能快乐的玩耍了 不就是多了几条数据吗 找了找发现没有让图标滑动的方法于是加了一个UIScrollView 然而X轴和Y轴的数据呢当然是是需要处理下啊 开始很笨的写了一个方法 将X轴的数组每隔3个放入一个时间数据,的确没有问题,但是Y轴呢,会动将空的字符串转为0 于是乎还是一样的丑 随后百度了一番并没有想要的结果只好苦逼的在PNBarChart中搜寻,这对于一个英语不是强项的人来说很蛋疼。 不过好在找到了self.barChart.yLabelSum
Y轴显示多少个标签
self.barChart.xLabelSkip
X轴间隔多少个显示 这两个方法就很人性化了 修饰过后顿时感觉好看多了