PNChart:一个简洁高效的iOS图表库

IzettaHafne 8年前
   <h2>1.要求</h2>    <p>PNChart 依赖于下列框架,在使用前请导入这些框架(ps:至于怎么导入,这里就不说了):</p>    <ul>     <li>Foundation.framework</li>     <li>UIKit.framework</li>     <li>CoreGraphics.framework</li>     <li>QuartzCore.framework<br> <strong>切记</strong> :这个框架依赖于第三方框架:UICountingLabel 请自行去 https://github.com 下载,并添加到这个框架中。</li>    </ul>    <h2>2.使用</h2>    <h3>2.1 折线图使用</h3>    <p style="text-align:center"><img src="https://simg.open-open.com/show/e3986e30c3de21a1dc786bb7143fd776.png"></p>    <p>折线图.png</p>    <pre>  <code class="language-objectivec">PNLineChart * lineChart = [[PNLineChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];      // 设置x轴上坐标内容      [lineChart setXLabels:@[@"1",@"2",@"3",@"4",@"5"]];      // 设置好像没什么用      lineChart.xLabelColor = [UIColor orangeColor];        lineChart.showLabel = YES;      // 是否显示Y轴的数值      lineChart.showGenYLabels = YES;      // 是否显示横向虚线      lineChart.showYGridLines = YES;      // 是否平滑的曲线      lineChart.showSmoothLines = NO;      // 是否显示xy 坐标轴      lineChart.showCoordinateAxis = YES;      // 轴的颜色      lineChart.axisColor = [UIColor orangeColor];      // 轴的宽度      lineChart.axisWidth = 2.0f;        NSLog(@"%f",lineChart.chartMarginLeft);        //    lineChart.thousandsSeparator = YES;      // 设置y轴坐标的颜色      lineChart.yLabelColor = [UIColor redColor];        // Line Chart No.1      NSArray * data01Array = @[@60.1, @160.1, @126.4, @262.2, @186.2];      PNLineChartData *data01 = [PNLineChartData new];      data01.color = PNFreshGreen;      data01.dataTitle = @"Hello World";      // 设置点的格式      data01.inflexionPointStyle = PNLineChartPointStyleCircle;      data01.inflexionPointColor = [UIColor purpleColor];      // 是否点label      data01.showPointLabel = YES;      data01.pointLabelColor = [UIColor redColor];      data01.pointLabelFont = [UIFont systemFontOfSize:12];      data01.pointLabelFormat = @"%1.1f";      // 设置折线有几个值      data01.itemCount = lineChart.xLabels.count;      data01.getData = ^(NSUInteger index) {          CGFloat yValue = [data01Array[index] floatValue];            // 设置x轴坐标对应的y轴的值          return [PNLineChartDataItem dataItemWithY:yValue];      };      // Line Chart No.2      NSArray * data02Array = @[@20.1, @180.1, @26.4, @202.2, @126.2];      PNLineChartData *data02 = [PNLineChartData new];      data02.color = PN推terColor;      data02.itemCount = lineChart.xLabels.count;      data02.getData = ^(NSUInteger index) {          CGFloat yValue = [data02Array[index] floatValue];          return [PNLineChartDataItem dataItemWithY:yValue];      };      // 设置line的数据数组      lineChart.chartData = @[data01, data02];      // 绘制出来      [lineChart strokeChart];        [self.view addSubview:lineChart];</code></pre>    <h3>2.2 柱状图使用</h3>    <p style="text-align:center"><img src="https://simg.open-open.com/show/0020d265b3908b02704745d1bc0f858c.png"></p>    <p>柱状图.png</p>    <pre>  <code class="language-objectivec">PNBarChart *barChart = [[PNBarChart alloc] initWithFrame:CGRectMake(0, 135.0, SCREEN_WIDTH, 200.0)];      // 是否显示xy 轴的数字      barChart.showLabel = YES;      // 是否显示水平线 但把柱子压低上移了      //    barChart.showLevelLine = YES;      //是否显示xy 轴      barChart.showChartBorder = YES;      // 是否显示柿子的数值      barChart.isShowNumbers = YES;      // 立体显示      barChart.isGradientShow = YES;      // 设置柱子的圆角      barChart.barRadius = 5;      // 设置bar color      barChart.strokeColor = [UIColor redColor];        barChart.xLabels = @[@"1",@"2",@"3",@"4",@"5"];        barChart.yValues = @[@"2",@"4",@"1",@"10",@"9"];        barChart.yLabelFormatter = ^ (CGFloat yLabelValue) {            return [NSString stringWithFormat:@"%f",yLabelValue];      };        [barChart strokeChart];        [self.view addSubview:barChart];</code></pre>    <h3>2.3 circle charet 使用</h3>    <p style="text-align:center"><img src="https://simg.open-open.com/show/8ce8d928d0b003e7b9f1455a2ed6a9ab.png"></p>    <p>circle Chart.png</p>    <pre>  <code class="language-objectivec">// 设置圆状图      PNCircleChart *circleChart = [[PNCircleChart alloc]initWithFrame:CGRectMake(100, 50, 200, 200) total:@100 current:@10 clockwise:NO shadow:YES shadowColor:[UIColor grayColor] displayCountingLabel:YES overrideLineWidth:@15];        circleChart.chartType = PNChartFormatTypePercent;      circleChart.strokeColor = [UIColor greenColor];        [circleChart strokeChart];        [self.view addSubview:circleChart];</code></pre>    <h3>2.4 饼状图使用</h3>    <p style="text-align:center"><img src="https://simg.open-open.com/show/06665cd514262b102e5858db7715732f.png"></p>    <p>饼状图.png</p>    <pre>  <code class="language-objectivec">NSArray *items = @[[PNPieChartDataItem dataItemWithValue:30 color:PNBrown description:@"cat"],[PNPieChartDataItem dataItemWithValue:20 color:PNDarkBlue description:@"pig"], [PNPieChartDataItem dataItemWithValue:50 color:PNGrey description:@"dog"]];        PNPieChart *pieChart = [[PNPieChart alloc] initWithFrame:CGRectMake(100, 100, 200, 200) items:items];        pieChart.delegate = self;      [pieChart strokeChart];      // 加到父视图上      [self.view addSubview:pieChart];        // 显示图例      pieChart.hasLegend = YES;      // 横向显示      pieChart.legendStyle = PNLegendItemStyleSerial;      // 显示位置      pieChart.legendPosition = PNLegendPositionTop;      // 获得图例 当横向排布不下另起一行      UIView *legend = [pieChart getLegendWithMaxWidth:100];      legend.frame = CGRectMake(100, 300, legend.bounds.size.width, legend.bounds.size.height);      [self.view addSubview:legend];</code></pre>    <p> </p>    <p>来自:http://www.jianshu.com/p/1dc4af401be5</p>    <p> </p>