一個流暢的iOS圖表框架PNChart

首先祭出此控制元件的網站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.yLabelSumY軸顯示多少個標籤 self.barChart.xLabelSkipX軸間隔多少個顯示 這兩個方法就很人性化了 修飾過後頓時感覺好看多了