CoreGraphics--饼状图

//传入数据,饼状图

pieChartView.dataArr = @[@20,@50,@80,@70,@40];

- (void)drawRect:(CGRect)rect {

// Drawing code

#if 0

//贝塞尔路径

UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(50, 50, 100, 100)];

//Oval 椭圆

//线条颜色

[[UIColor redColor] setStroke];

//线条宽度

path.lineWidth = 5;

//开始画

[path stroke];

//设置填充颜色

[[UIColor yellowColor] set];

//开始填充

[path fill];

#endif

//开始

CGFloat startDegress = 0;

//结束

CGFloat endDegress = 0;

for (int i = 0; i < _dataArr.count; i++) {

//终点弧

//计算数据每个元素的值所占的百分比

endDegress += M_PI * 2 *([self.dataArr[i] floatValue]/[self sum]);

//弧 路径

UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.frame.size.width/2, self.frame.size.height/2) radius:MIN(self.frame.size.width, self.frame.size.height)/2 startAngle:startDegress endAngle:endDegress clockwise:YES];

//更底层(这两句,相当于上面一句)

//        CGMutablePathRef path = CGPathCreateMutable();

//        CGPathAddArc(path, NULL,self.frame.size.width/2,self.frame.size.height/2, MIN(self.frame.size.width, self.frame.size.height)/2, startDegress, endDegress, YES);

//重新修改开始的弧度

//第二个弧的起点 ,是上一个弧的终点

startDegress  = endDegress;

//注意:先画一个弧,然后终点-圆心 画一条线(以便能够填充,否则不能填充)

//坐标为圆心

[path addLineToPoint:CGPointMake(self.frame.size.width/2, self.frame.size.height/2)];

//线条颜色

//        [[self randomColor] setStroke];

//线条宽度

//        path.lineWidth = 5;

//开始画

//        [path stroke];

//设置填充颜色

[[self randomColor] set];

//开始填充

[path fill];

}

}

- (UIColor *)randomColor{

return [UIColor colorWithRed:arc4random()%256/255.0 green:arc4random()%256/255.0 blue:arc4random()%256/255.0 alpha:1];

}

- (void)setDataArr:(NSArray *)dataArr{

_dataArr = dataArr;

//调用drawRect刷新(再走一次上面)

[self setNeedsDisplay];

}

//获取数组中总数

#pragma mark -- 计算数组中 数据的总和

- (CGFloat)sum{

__block CGFloat sum = 0;

[self.dataArr enumerateObjectsUsingBlock:^(id obj, NSUInteger idx, BOOL *stop) {

sum = sum + [obj floatValue];

}];

return sum;

}

时间: 2024-10-24 21:21:39

CoreGraphics--饼状图的相关文章

php验证码+缩略图+饼状图+五环图

@1.验证码 1 captcher.php 2 header('Content-type:image/png'); 3 session_start(); 4 $img = imagecreate(100, 30); 5 $captcha = array( 6 'a', 'b', 'c', 'd', 'e', 'f', 7 'g', 'h', 'i', 'j', 'k', 'l', 8 'm', 'n', 'o', 'p', 'q', 'r', 9 's', 't', 'u', 'v', 'w',

iOS:使用贝塞尔曲线绘制图表(折线图、柱状图、饼状图)

1.介绍: UIBezierPath :画贝塞尔曲线的path类 UIBezierPath定义 : 贝赛尔曲线的每一个顶点都有两个控制点,用于控制在该顶点两侧的曲线的弧度. 曲线的定义有四个点:起始点.终止点(也称锚点)以及两个相互分离的中间点. 滑动两个中间点,贝塞尔曲线的形状会发生变化. UIBezierPath :对象是CGPathRef数据类型的封装,可以方便的让我们画出 矩形 . 椭圆 或者 直线和曲线的组合形状 初始化方法: + (instancetype)bezierPath; /

折线图 饼状图 柱状图

xaml 文件 <Window x:Class="Supplier.TrendCharts" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="产品价格趋势图" Height="500" Width

AngularJS in Action读书笔记5(实战篇)——在directive中引入D3饼状图显示

前言: "宁肯像种子一样等待  也不愿像疲惫的陀螺  旋转得那样勉强" 这是前几天在查资料无意间看到的一位园友的签名,看完后又读了两遍,觉得很有味道.后来一寻根究底才知这是出资大诗人汪国真之口,出处<她>.且抛开上下文,单从这短短几句,正恰如其分的折射出有一群人,他们穿着不那么fashion,言辞不那么犀利,但是内心某一块地方像是躁动的火山,拥有无尽的动力和激情,矢志不渝种子般投身到技术研究和心得分享当中. 或许每一次的生长都是那么悄无声息,但是无数次的坚持只是为了破土那日

Echarts生成饼状图、条形图以及线形图 JS封装

1.在我们开发程序中,经常会用到生成一些报表,比方说饼状图,条形图,折线图等.不多说了,直接上封装好的代码,如下Echarts.js所示 以下代码是封装在Echarts.js文件中 /** * Created by Administrator on 2015/8/7. */ var charec; // 路径配置 require.config({ paths: { echarts: 'http://echarts.baidu.com/build/dist' } }); // 按需加载所需图表 r

[控件] 画饼状图的控件

画饼状图的控件 效果 注意:支持遮罩效果 源码 https://github.com/YouXianMing/CircleView // // CircleView.h // YXMWeather // // Created by XianMingYou on 15/5/12. // Copyright (c) 2015年 XianMingYou. All rights reserved. // #import <UIKit/UIKit.h> @interface CircleView : U

android圆饼状图中怎么设置百分比

============问题描述============ 我希望设置成能显示百分数的,如下图 这是我画饼状图的方法,我想给我一点思路 public void drawArc(RectF oval, float startAngle, float sweepAngle, boolean useCenter, Paint paint) ============解决方案1============ http://www.2cto.com/kf/201402/278932.html ===========

销售统计饼状图

销售统计,画出饼状图(动态) 技术: Hightchart (前端) 思路:1.关联查询几张表获取数据  2.dao层将sql语句转成hql语句 3.service层   4Action 5.前端  注意配置文件 1.关联查询几张表获取数据 //操作的对象:(开始日期(创建订单的日期) orders),商品类型goodstype,销售额(sum()orderdetail); 找出关联的中间表是goods, 条件查询的是日期是orderdetail //1.数据库实现查询 --1.关联4张表 se

Android之自定义控件实现天气温度折线图和饼状图

以前写了个天气的APP,最近把他更新了一个版本,就抽取其中的天气温度折现图这个功能写了这篇博客,来与大家分享,希望对你有所帮助. 效果如图: 代码: MainActivity.Java /**** * 饼状图和天气折线图 */ public class MainActivity extends AppCompatActivity { private WeatnerChartView chart1; private WeatnerChartView chart2; private PinChart

html5 canvas实现饼状图

实现的效果如下: 通过canvas来实现的,主要是想练习封装插件.只需要在html里面简单的添加代码,就可以实现饼状图的自动添加.对于饼状图的颜色,比例等都可以根据需要进行调节. 具体的代码地址: