用PNChart生成簡潔的的iOS圖表 帶動畫效果

PNChart 可以在 iOS 下實現效果不錯的曲線圖和柱狀圖,可以動態生成圖表。本文我們來簡單看一下 PNChart生成簡潔高效有動畫效果的iOS圖表庫。

先來看看PNChart的示意圖

用PNChart生成簡潔的的iOS圖表 帶動畫效果


導入
pod導入相對簡單,要手動導入這個庫,先下載下來(https://github.com/kevinzhow/PNChart),解壓後把PNChart文件夾拖入工程中
運行發現#import"PNRadarChartDataItem.h"報紅,在它的.h文件裏引入#import頭文件;#import報錯,下載UICountingLabel(https://github.com/dataxpress/UICountingLabel)解壓後把UICountingLabel的.m和.h文件拖入工程,把報錯的#import頭文件換爲#import"UICountingLabel.h"
專案中引用頭文件#import"PNChart.h"
折線圖
PNLineChart * lineChart = [[PNLineChartalloc]initWithFrame:CGRectMake(0,135.0,SCREEN_WIDTH,200.0)];
//X軸數據
[lineChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5"]];

//Y軸數據
NSArray * data01Array =@[@60.1,@160.1,@126.4,@262.2,@186.2];
PNLineChartData *data01 = [PNLineChartDatanew];
data01.color = PNFreshGreen;
data01.itemCount = lineChart.xLabels.count;
data01.getData = ^(NSUInteger index) {
CGFloat yValue = [data01Array[index] floatValue];
return [PNLineChartDataItemdataItemWithY:yValue];
};

//可以添加多條折線
NSArray * data02Array =@[@20.1,@180.1,@26.4,@202.2,@126.2];
PNLineChartData *data02 = [PNLineChartDatanew];
data02.color = PNTwitterColor;
data02.itemCount = lineChart.xLabels.count;
data02.getData = ^(NSUInteger index) {
CGFloat yValue = [data02Array[index] floatValue];
return [PNLineChartDataItemdataItemWithY:yValue];
};

lineChart.chartData = @[data01, data02];
[lineChart strokeChart];
//載入在視圖上
[self.windowaddSubview:lineChart];
柱狀圖
PNBarChart * barChart = [[PNBarChartalloc]initWithFrame:CGRectMake(0,135.0,SCREEN_WIDTH,200.0)];
//X軸數據
[barChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5"]];
//Y軸數據
[barChart setYValues:@[@1, @10,@2,@6,@3]];
[barChart strokeChart];

//載入在視圖上
[self.windowaddSubview:barChart];
餅狀圖
PNPieChart *pieChart = [[PNPieChartalloc]initWithFrame:CGRectMake(40.0,155.0,240.0,240.0)items:items];
//餅狀圖文字顔色
pieChart.descriptionTextColor = [UIColorwhiteColor];
pieChart.descriptionTextFont = [UIFontfontWithName:@"Avenir-Medium"size:14.0];
//繪制
[pieChart strokeChart];

//載入在視圖上
[self.windowaddSubview:pieChart];
圓形進度條
// total參數是進度條的總數據量,current是當前的數據量,closewise是繪制方向,YES是從左到右,NO爲從右到左
PNCircleChart *circleChart = [[PNCircleChartalloc]initWithFrame:CGRectMake(40.0,155.0,240.0,240.0)total:@100current:@30clockwise:NO];

//繪制圖形
[circleChart strokeChart];

//載入在視圖上
[self.windowaddSubview:circleChart];



PNChart簡單帶有動畫效果的圖表庫實例

用PNChart生成簡潔的的iOS圖表 帶動畫效果

需要
PNChart支持iOS6.0以上系統,使用ARC。使用需要安裝以下框架:
Foundation
UIKit
CoreGraphics
QuartzCore
用法
複制PNChart文件夾到工程中
#import "PNChart.h"

//For LineChart
PNChart * lineChart = [[PNChart alloc] initWithFrame:CGRectMake(0, 75.0, SCREEN_WIDTH, 200.0)];
[lineChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5"]];
[lineChart setYValues:@[@"1",@"10",@"2",@"6",@"3"]];
[lineChart strokeChart];
//For BarChart
PNChart * barChart = [[PNChart alloc] initWithFrame:CGRectMake(0, 75.0, SCREEN_WIDTH, 200.0)];
barChart.type = PNBarType;
[barChart setXLabels:@[@"SEP 1",@"SEP 2",@"SEP 3",@"SEP 4",@"SEP 5"]];
[barChart setYValues:@[@"1",@"10",@"2",@"6",@"3"]];
[barChart strokeChart];
//By strokeColor you can change the chart color
[barChart setStrokeColor:PNTwitterColor];

更多相關文章
  • 本文章給大家介紹一篇關于iOS 畫面切換的各種動畫效果附私有API,希望此教程對大家會有所幫助哦.ios的畫面切換的動畫效果的API主要通過調用系統已定義的動畫效果實現,這些效果已基本囊括開發的需求,如果需要更加複雜的效果,可以考慮CATransition來實現以下是基本的四種效果kCATransi ...
  • 本文我們介紹一下IOS開發UI中的核心動畫基礎知識,本文主要內容是講CALayer動畫框架,圖層變換,專用圖層等.CALayer包含在QuartzCore框架中,這是一個跨平台的框架,既可以用在iOS中又可以用在Mac OS X中.在iOS中CALayer的設計主要是了爲了內容展示和動畫操作,CAL ...
  • ChartSQL輕松讓你SQL語句生成圖表
    ChartSQL可以用你的SQL查詢語句生成圖片,ChartSQL的圖表結果通過SVG的渲染方式嵌入到網頁中,並直接在浏覽器上顯示出來.ChartSQL 可以讓你用 SQL 語句來生成圖表,圖表可使用 SVG 向量圖進行渲染,可輕松的嵌入到網頁中.ChartSQL 可以通過 FnordMetric
  • Circliful簡約的圓形統計圖表jQuery插件
    下面我們一起來看一篇非常不錯的Circliful簡約的圓形統計圖表jQuery插件使用方法
  • 我們知道網站地址有利于搜索引擎的收錄,wordpress有自帶的xml格式的網站地圖,如果我們也希望生成txt格式的地圖呢?本文我們用純代碼方法來實現.該方法不需要安裝任何插件,純代碼生成.<?php require('./wp-blog-header.php'); header('Conte ...
  • 在jquery中ajax 提交表單我們可以直接使用$.post或$.ajax 進行提交了,下面小編來給大家介紹一下ajax提交表單實例.最簡單就這樣 代碼如下 $.post("/index.php?action=ajax&rs=TWProAjax::checkProTermsExi ...
  • 常用的JavaScript檢測浏覽器爲IE是哪個版本的代碼.包括是否是最人極端厭惡的ie6識別與檢測.具體方法 代碼如下 var isIE=!!window.ActiveXObject;var isIE6=isIE&&!window.XMLHttpRequest;var isIE8= ...
  • 下面來看看關于xcode載入圖片點擊事件,圖片帶參數,希望這個例子能幫助到各位同學哦.clickx 作爲一個方法被調用,表示當你點擊圖片的時候出發這個方法,這個方法可以自己隨便寫比如abc,clicky 代碼如下 -
一周排行
  • 本文章來給大家介紹利用MySQL用shell命令導入*.sql數據庫的方法,雖然我們可以使用phpmyadmin來導入但是有時數據大了導入會有問題.用phpmyadmin導入數據庫,但是這樣做還有文件上傳大小限制,上
  • 下面來看兩個mysql 導入導出CSV數據的例子,這此都用到了mysql自帶的命令了,如 LOAD DATA LOCAL INFILE 或select * INTO OUTFILE命令了.cvs文件導入MySql數據
  • 在php中simplexml_load_string() 函數把 XML 字符串載入對象中了,下面我來給大家介紹幾個簡單實例的同時也介紹在使用simplexml_load_string的一些需要注意的事項.先用一段代
  • 在一般的小數據分頁是我們就用簡單的分頁功能就可以了,但如果上百萬級數據分頁了,那麽我就不得不考慮到高效mssql存儲過程分頁代碼哦.declare @TotalCount int declare @TotalPage
  • 下面小編整理了一篇關于linux中安裝PycURL出現的問題解決辦法,這個有pip安裝錯誤及python安裝錯誤了,下面一起來看解決辦法.使用pip安裝PycURL時發現如下報錯:src/pycurl.h:
  • CentOS中編譯安裝Python2.7其實很簡單的,下面我們只使用了幾步就成功的安裝好,有需要的朋友一起來看看.心血來潮,想學習一下Python,聽說用來做爬蟲還不錯.先從運行環境開始入手,CentOS中已經內置了 ...
  • 本文章來簡單的介紹METHOD的用法,這在php5之後才會有的魔術常量,有需要的朋友可參考.__METHOD__ 是PHP5之後新增的魔術常量,表示的是類文法的名稱 代碼如下 <?phpclass chhua{ ...
  • Firebug是一款革命性的Firefox擴展插件,它可以幫助網頁開發者與設計師測試檢查前端代碼,爲我們提供大量有用的特色功能,比如延遲信息控制板.DOM查看器.頁面元素的逐條信息等.盡管Firebug已經是捆綁了大 ...
  • 我們來看一個實現基于css實現 IE6下div垂直居中對齊的實現方法,有需要的朋友可以參考一下下. 代碼如下 <style type="text/css">.fixVerticalCe ...
  • Percona 爲 MySQL 數據庫伺服器進行了改進,在功能和效能上較 MySQL 有著很顯著的提升.該版本提升了在高負載情況下的 InnoDB 的效能.爲 DBA 提供一些非常有用的效能診斷工具:另外有更多的參數