demo地址: https://github.com/xuuhan
HXCharts
HXCharts包括了儀表盤、柱狀圖、圓形圖驱还、折線圖等四種繪圖。
儀表盤凸克、柱狀圖议蟆、圓形圖支持漸變色或單色，折線圖只支持單色
柱狀圖支持水平和豎直兩種方向萎战。
儀表盤咐容、柱狀圖、折線圖可以自定義標(biāo)注值的數(shù)量蚂维。
下面是在項(xiàng)目中使用HXCharts的實(shí)際效果:
xx.gif
語(yǔ)言
- Objective-C
安裝
- 下載demo戳粒，將HXcharts文件夾拖入到自己項(xiàng)目中
使用
xx1.gif
- 導(dǎo)入頭文件
#import "HXCharts.h"
儀表盤
- 用初始化方法并傳入最大值與實(shí)際值
- 傳入顏色
- 傳入要顯示標(biāo)注值的數(shù)量
HXGaugeChart *gauge = [[HXGaugeChart alloc] initWithFrame:CGRectMake(x, y, chartWidth, chartWidth) withMaxValue:300 value:225];
gauge.valueTitle = @"225";
gauge.colorArray = @[[self colorWithHexString:@"#33d24e" alpha:1],
[self colorWithHexString:@"#f8e71c" alpha:1],
[self colorWithHexString:@"#ff9500" alpha:1],
[self colorWithHexString:@"#ff4e65" alpha:1]];
gauge.locations = @[@0.15,@0.4,@0.65,@0.8];
gauge.markLabelCount = 5;
[self.view addSubview:gauge];
圓形圖
- 用初始化方法并傳入最大值與實(shí)際值
- 傳入顏色
HXCircleChart *circle = [[HXCircleChart alloc] initWithFrame:CGRectMake(x, y, chartWidth, chartWidth) withMaxValue:100 value:85];
circle.valueTitle = @"85%";
circle.colorArray = @[[self colorWithHexString:@"#00fec7" alpha:1],[self colorWithHexString:@"#00d8fe" alpha:1]];
circle.locations = @[@0.15,@0.85];
[self.view addSubview:circle];
柱狀圖
- 用初始化方法傳入標(biāo)注值的個(gè)數(shù)與繪圖方向
- 傳入文字?jǐn)?shù)組
- 傳入對(duì)應(yīng)值數(shù)組
- 傳入柱子顏色數(shù)組與背景線顏色(默認(rèn)灰色)
- 要修改柱子的寬度需要去.m文件中修改_margin(柱子間間距)的值
HXBarChart *bar = [[HXBarChart alloc] initWithFrame:CGRectMake(barChartX, barChartY, barChartWidth, barChartHeight) withMarkLabelCount:6 withOrientationType:OrientationHorizontal];
bar.titleArray = @[@"一月",@"二月",@"三月",@"四月",@"五月",@"六月"];
bar.valueArray = @[@"34",@"72",@"260",@"44",@"180",@"53"];
bar.colorArray = @[color1,color2,color3,color4,color5,color6];
bar.locations = @[@0.15,@.85];
bar.backgroundLineColor = [self colorWithHexString:@"#4b4e52" alpha:1];
[self.view addSubview:bar];
折線圖
- 初始化
- 傳入文字?jǐn)?shù)組
- 傳入對(duì)應(yīng)值數(shù)組
- 傳入畫線顏色路狮、填充顏色與背景線顏色(默認(rèn)灰色)
HXLineChart *line = [[HXLineChart alloc] initWithFrame:CGRectMake(lineChartX, lineChartY, lineChartWidth, lineChartHeight)];
[line setTitleArray:@[@"星期一",@"星期二",@"星期三",@"星期四",@"星期五",@"星期六",@"星期日"]];
[line setValue:@[@11,@44,@193,@57,@66,@144,@156] withYLineCount:6];
line.lineColor = [self colorWithHexString:@"#43befa" alpha:1];
line.fillColor = [self colorWithHexString:@"#2e3f53" alpha:0.5];
line.backgroundLineColor = [self colorWithHexString:@"#4b4e52" alpha:1];
[self.view addSubview:line];
說(shuō)明
demo中顏色使用的是漸變色，也可以選擇單色蔚约，更多屬性請(qǐng)去.h文件里看
demo中內(nèi)附16進(jìn)制顏色轉(zhuǎn)三原色方法
有任何建議歡迎留言 一起討論
下面一篇文章介紹了更詳細(xì)的用法 : http://www.reibang.com/p/e478636d7718
