- 看到朋友讨论群里面发了一个类似于这样的需求，当时很感兴趣，刚好上线了，有点闲暇时间，决定试一试。（上面是完成的效果图，没有做适配）
View.h文件
#import <UIKit/UIKit.h>
@interface GraphView : UIView
@property(nonatomic,strong)NSDictionary *dataDic;// 接收数据信息
@property(nonatomic,strong)NSArray *nameArr;
@end
View.m文件
#import "GraphView.h"
#define kCount self.dataDic.count // 传入的数据中的个数
@implementation GraphView
- (void)drawRect:(CGRect)rect
{
//一个不透明类型的Quartz 2D绘画环境,相当于一个画布,你可以在上面任意绘画
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(context, 2.0); // 线宽
CGContextSetStrokeColorWithColor(context, [UIColorgrayColor].CGColor);// 线框颜色
UIColor *aColor = [UIColorcolorWithRed:1green:0.5blue:0.2alpha:0.2];
CGContextSetFillColorWithColor(context, aColor.CGColor);// 填充颜色
//
CGPoint center = CGPointMake(200, 200);
// 从一个点开始
CGContextMoveToPoint(context, center.x, center.y + 160.0);
for(int i = 1; i < kCount; ++i)
{
self.nameArr = @[@"Chinese",@"Math",@"English",@"History",@"PE"];
//
CGPoint point = [self getXAndYWithScores:_dataDic[_nameArr[i - 1]] integer:i];
// 记录上一个点，并连接到这个点；
CGContextAddLineToPoint(context, center.x + point.x, center.y + point.y);
}
CGContextClosePath(context); // 结束一次画图
CGContextDrawPath(context, kCGPathFillStroke);// 图形内容填充颜色方式（填满）
CGContextStrokePath(context); // 可不要
// 如果是画两组不同的图形， 重新创建一次 CGContextRef
CGContextRef context2 = UIGraphicsGetCurrentContext();
CGContextSetRGBStrokeColor(context2, 28, 132, 250, 1);
CGContextSetLineWidth(context2, 1.0);
CGContextSetStrokeColorWithColor(context2, [UIColorlightGrayColor].CGColor);// 线框颜色
// 几条射线，和注释
for(int i = 1; i <= kCount; i++)
{
CGContextMoveToPoint(context2, center.x, center.y);
CGFloat x = 200.0 * sinf(i * 2.0 * M_PI / kCOunt);
CGFloat y = 200.0 * cosf(i * 2.0 * M_PI / 5.0);
CGContextAddLineToPoint(context2, center.x + x, center.y + y);
UILabel *nameLb = [[UILabelalloc]initWithFrame:CGRectMake(0, 0, 80, 30)];
nameLb.text = self.nameArr[i - 1];
nameLb.center = CGPointMake(center.x + x, center.y + y);
[selfaddSubview:nameLb];
}
CGContextClosePath(context2);
CGContextDrawPath(context2, kCGPathFillStroke);
CGContextStrokePath(context2);
}
//
- (CGPoint)getXAndYWithScores:(NSString *)scores integer:(NSInteger)integer
{
CGFloat x = 160.0 * ([scores floatValue] / 100) * sinf(integer * 2.0 * M_PI / kCount
);// 如果想要多边形， 改动5.0 就行了， 前面相应的地方也修改
CGFloat y = 160.0 * ([scores floatValue] / 100) * cosf(integer * 2.0 * M_PI / kCount);
CGPoint point = CGPointMake(x, y);
return point;
}
调用View
#import "ViewController.h"
#import "GraphView.h"
@interfaceViewController ()
@end
@implementation ViewController
- (void)viewDidLoad {
[superviewDidLoad];
// 多线的， 可以根据需求进行调整
NSDictionary *dataDic = @{@"Chinese":@66,@"Math":@88,@"English":@54,@"History":@90,@"PE":@40};// 随意填写, 数组更加方便
GraphView *grapview = [[GraphView alloc]initWithFrame:self.view.bounds];
grapview.dataDic = dataDic;// 传值到 UIView界面
grapview.backgroundColor = [UIColor clearColor];
[self.view addSubview:grapview];
}
// 6边形的效果
六边形2.png
