iOS-中集成百度echarts3-0-白红宇

突然项目中要用到图表，所以就用了百度的echarts，然后就是网上搜了一下，由于本人的JS不是很熟悉，但是研究了一下还是做出来了，其实也不是很难最后做的效果大概如下图这种，由于界面上没调整，所以粗糙了一点!

不多说前端的代码如下


    
    ECharts
    
    
复制代码

json 文件代码如下

{"status": "1","message": "成功","data": [{"p": "174","qb": "33","q": "39","qc": "50","ia": "27","fixTimeDate": "1490284800000","s": "127","cosb": "93","cos": "29","ib": "30","ua": "10720","ub": "10387","ic": "23","devId": "8a3ae71e5ac56347015ac6520afd0002","uc": "10646","id": "418A48AEDFAA4236854388B4F38D41F6","pa": "144","recTime": "1490284599000","sa": "137","cosc": "58","pb": "187","sb": "109","pc": "132","sc": "119","cosa": "20","qa": "31"},{"p": "174","qb": "33","q": "39","qc": "50","ia": "27","fixTimeDate": "1490284800000","s": "127","cosb": "93","cos": "29","ib": "30","ua": "10720","ub": "10387","ic": "23","devId": "8a3ae71e5ac56347015ac6520afd0002","uc": "10646","id": "418A48AEDFAA4236854388B4F38D41F6","pa": "144","recTime": "1490284599000","sa": "137","cosc": "58","pb": "187","sb": "109","pc": "132","sc": "119","cosa": "20","qa": "31"},{"p": "174","qb": "33","q": "39","qc": "50","ia": "27","fixTimeDate": "1490284800000","s": "127","cosb": "93","cos": "29","ib": "30","ua": "10720","ub": "10387","ic": "23","devId": "8a3ae71e5ac56347015ac6520afd0002","uc": "10646","id": "418A48AEDFAA4236854388B4F38D41F6","pa": "144","recTime": "1490284599000","sa": "137","cosc": "58","pb": "187","sb": "109","pc": "132","sc": "119","cosa": "20","qa": "31"},{"p": "174","qb": "33","q": "39","qc": "50","ia": "27","fixTimeDate": "1490284800000","s": "127","cosb": "93","cos": "29","ib": "30","ua": "10720","ub": "10387","ic": "23","devId": "8a3ae71e5ac56347015ac6520afd0002","uc": "10646","id": "418A48AEDFAA4236854388B4F38D41F6","pa": "144","recTime": "1490284599000","sa": "137","cosc": "58","pb": "187","sb": "109","pc": "132","sc": "119","cosa": "20","qa": "31"}]}复制代码

这里做的只是一个测试项目，所以json 里面的数据都是一样的

控制器中设立了一个表格然后读取本地的数据

#import "ViewController.h"#import "HistoryDateCell.h"#import "HistoryDateModel.h"#import "MJExtension.h"@interface ViewController ()
    
     /** 表格 */@property(strong,nonatomic) UITableView *tableView;@property(strong,nonatomic) NSArray *historyArray;@end@implementation ViewControllerstatic NSString *HistoryDateCellID = @"HistoryDateCellId";- (void)viewDidLoad {[super viewDidLoad];[self setupTableView];[self initJson];}#pragma mark - JSON 解析-(void)initJson{NSString *filePath = [[NSBundle mainBundle] pathForResource:@"test" ofType:@"json"];NSData *jdata = [[NSData alloc]initWithContentsOfFile:filePath];NSDictionary *hisDict = [NSJSONSerialization JSONObjectWithData:jdata options:kNilOptions error:nil];self.historyArray = [HistoryDateModel mj_objectArrayWithKeyValuesArray:hisDict[@"data"]];}#pragma mark - 设置表格-(void)setupTableView{self.tableView = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStylePlain];for (UIView *subView in self.tableView.subviews) {if ([subView isKindOfClass:[UIScrollView class]]) {((UIScrollView *)subView).delaysContentTouches = NO;}}self.tableView.delaysContentTouches = NO;self.tableView.delegate = self;self.tableView.dataSource = self;[self.tableView registerNib:[UINib nibWithNibName:NSStringFromClass([HistoryDateCell class]) bundle:nil] forCellReuseIdentifier:HistoryDateCellID];[self.view addSubview:self.tableView];}- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{return 1;}- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{HistoryDateCell *cell = [tableView dequeueReusableCellWithIdentifier:HistoryDateCellID];cell.historyDate = self.historyArray;cell.selectionStyle = UITableViewCellSelectionStyleNone;return cell;}-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{return 320;}-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{[tableView deselectRowAtIndexPath:indexPath animated:YES];}- (void)didReceiveMemoryWarning {[super didReceiveMemoryWarning];// Dispose of any resources that can be recreated.}@end复制代码

然后话折线图的代码都放在自定义cell 的代码里面，具体如下，我这里是对传入的参数进行了分类真正测试的话不会有这个复杂，并且我用的是wkwebview，这个的内存泄露没UIwebview那么严重，所以就用了这个

#import "HistoryDateCell.h"#import "HistoryDateModel.h"#import 
    
     #import "TimeTools.h"#define BTN_BACKCOLOR JdryRGBColorAlpha(25, 180, 212, 0.2)#define SELECTBTN_BACKCOLOR JdryColorFromHex(0xFFFFFF)/* 颜色进行宏定义 */#define JdryColorFromHex(s)  [UIColor colorWithRed:(((s & 0xFF0000) >> 16))/255.0 green:(((s &0xFF00) >>8))/255.0 blue:((s &0xFF))/255.0 alpha:1.0]#define JdryRGBColor(r,g,b) [UIColor colorWithRed:(r)/255.0 green:(g)/255.0 blue:(b)/255.0 alpha:1.0]#define JdryRGBColorAlpha(r,g,b,a) [UIColor colorWithRed:(r)/255.0 green:(g)/255.0 blue:(b)/255.0 alpha:a];#define BACK_COLOR JdryColorFromHex(0xE8F0F2)#define BLUE_COLOR JdryColorFromHex(0x19B5D4)#define RED_COLOR JdryColorFromHex(0xF95656)/* 获取设备屏幕的大小 */#define JdryScreeWidth [UIScreen mainScreen].bounds.size.width#define JdryScreeHeight [UIScreen mainScreen].bounds.size.height#define JdryScreeBounds [UIScreen mainScreen].bounds@interface HistoryDateCell ()
     
      @property (weak, nonatomic) IBOutlet UIButton *dayBtn;@property (weak, nonatomic) IBOutlet UIButton *monthBtn;@property (weak, nonatomic) IBOutlet UIButton *yearBtn;/** echart */@property(strong,nonatomic) WKWebView *wkWebView;/** xAxisData */@property(strong,nonatomic) NSString *xAxisData;/** 总 */@property(strong,nonatomic) NSMutableString *valueDat;/** A */@property(strong,nonatomic) NSMutableString *valueDatA;/** B */@property(strong,nonatomic) NSMutableString *valueDatB;/** C */@property(strong,nonatomic) NSMutableString *valueDatC;/** X轴 */@property(strong,nonatomic) NSMutableString *xAxis;@end@implementation HistoryDateCell- (void)awakeFromNib {[super awakeFromNib];self.xAxis = [NSMutableString string];[self setEcharts:self.webContentView];}-(void)setHistoryDate:(NSArray *)historyDate{_historyDate = historyDate;self.subType = @"cos";self.timeType = @"2";[self selectSubType:self.subType timeType:_timeType];}-(void)selectSubType:(NSString *)subType timeType:(NSString *)timeType{self.valueDat = [NSMutableString string];self.valueDatA = [NSMutableString string];self.valueDatB = [NSMutableString string];self.valueDatC = [NSMutableString string];if ([subType isEqualToString:@"I"]) {for (HistoryDateModel *model in _historyDate) {[_valueDatA appendString:[NSString stringWithFormat:@"'%@',",model.ia]];[_valueDatB appendString:[NSString stringWithFormat:@"'%@',",model.ib]];[_valueDatC appendString:[NSString stringWithFormat:@"'%@',",model.ic]];}}else if ([subType isEqualToString:@"U"]){for (HistoryDateModel *model in _historyDate) {[_valueDatA appendString:[NSString stringWithFormat:@"'%@',",model.ua]];[_valueDatB appendString:[NSString stringWithFormat:@"'%@',",model.ub]];[_valueDatC appendString:[NSString stringWithFormat:@"'%@',",model.uc]];}}else if ([subType isEqualToString:@"P"]){for (HistoryDateModel *model in _historyDate) {[_valueDat appendString:[NSString stringWithFormat:@"'%@',",model.p]];[_valueDatA appendString:[NSString stringWithFormat:@"'%@',",model.pa]];[_valueDatB appendString:[NSString stringWithFormat:@"'%@',",model.pb]];[_valueDatC appendString:[NSString stringWithFormat:@"'%@',",model.pc]];}}else if ([subType isEqualToString:@"Q"]){for (HistoryDateModel *model in _historyDate) {[_valueDat appendString:[NSString stringWithFormat:@"'%@',",model.q]];[_valueDatA appendString:[NSString stringWithFormat:@"'%@',",model.qa]];[_valueDatB appendString:[NSString stringWithFormat:@"'%@',",model.qb]];[_valueDatC appendString:[NSString stringWithFormat:@"'%@',",model.qc]];}}else if ([subType isEqualToString:@"S"]){for (HistoryDateModel *model in _historyDate) {[_valueDat appendString:[NSString stringWithFormat:@"'%@',",model.s]];[_valueDatA appendString:[NSString stringWithFormat:@"'%@',",model.sa]];[_valueDatB appendString:[NSString stringWithFormat:@"'%@',",model.sb]];[_valueDatC appendString:[NSString stringWithFormat:@"'%@',",model.sc]];}}else if ([subType isEqualToString:@"cos"]){for (HistoryDateModel *model in _historyDate) {[_valueDat appendString:[NSString stringWithFormat:@"'%@',",model.cos]];[_valueDatA appendString:[NSString stringWithFormat:@"'%@',",model.cosa]];[_valueDatB appendString:[NSString stringWithFormat:@"'%@',",model.cosb]];[_valueDatC appendString:[NSString stringWithFormat:@"'%@',",model.cosc]];}}for (HistoryDateModel *model in _historyDate) {if ([timeType isEqualToString:@"0"]) {[_xAxis appendString:[NSString stringWithFormat:@"'%@',",[TimeTools timeWithDateAndHourAndMIn:model.fixTimeDate]]];}else if ([timeType isEqualToString:@"1"]){[_xAxis appendString:[NSString stringWithFormat:@"'%@',",[TimeTools timeWithDayAndMonthString:model.fixTimeDate]]];}else if ([timeType isEqualToString:@"2"]){[_xAxis appendString:[NSString stringWithFormat:@"'%@月',",[TimeTools timeWithDateAndMonth:model.fixTimeDate]]];}}if (![subType isEqualToString:@"I"] && ![subType isEqualToString:@"U"]) {[_valueDat deleteCharactersInRange:NSMakeRange(_valueDat.length -1, 1)];}[_valueDatA deleteCharactersInRange:NSMakeRange(_valueDatA.length -1, 1)];[_valueDatB deleteCharactersInRange:NSMakeRange(_valueDatB.length -1, 1)];[_valueDatC deleteCharactersInRange:NSMakeRange(_valueDatC.length -1, 1)];[_xAxis deleteCharactersInRange:NSMakeRange(_xAxis.length -1, 1)];}#pragma mark - 设置echarts-(void)setEcharts:(UIView *)contentView{NSString *path = [[NSBundle mainBundle] pathForResource:@"HistoryData" ofType:@"html"];self.wkWebView = [[WKWebView alloc] initWithFrame:CGRectMake(0, 0, JdryScreeWidth - 30, 406)];if(path){if ([[UIDevice currentDevice].systemVersion floatValue] >= 9.0) {NSURL *fileURL = [NSURL fileURLWithPath:path];[self.wkWebView loadFileURL:fileURL allowingReadAccessToURL:fileURL];} else {NSURL *fileURL = [self fileURLForBuggyWKWebView8:[NSURL fileURLWithPath:path]];NSURLRequest *request = [NSURLRequest requestWithURL:fileURL];[self.wkWebView loadRequest:request];}}self.wkWebView.navigationDelegate = self;[contentView addSubview: self.wkWebView];}- (NSURL *)fileURLForBuggyWKWebView8:(NSURL *)fileURL {NSError *error = nil;if (!fileURL.fileURL || ![fileURL checkResourceIsReachableAndReturnError:&error]) {return nil;}// Create "/temp/www" directoryNSFileManager *fileManager= [NSFileManager defaultManager];NSURL *temDirURL = [[NSURL fileURLWithPath:NSTemporaryDirectory()] URLByAppendingPathComponent:@"www"];[fileManager createDirectoryAtURL:temDirURL withIntermediateDirectories:YES attributes:nil error:&error];NSURL *dstURL = [temDirURL URLByAppendingPathComponent:fileURL.lastPathComponent];// Now copy given file to the temp directory[fileManager removeItemAtURL:dstURL error:&error];[fileManager copyItemAtURL:fileURL toURL:dstURL error:&error];// Files in "/temp/www" load flawlesly :)return dstURL;}-(void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{[self.wkWebView evaluateJavaScript:[NSString stringWithFormat:@"setValueDate([%@])",_valueDat] completionHandler:^(id dict, NSError * error) {NSLog(@"%@",error);}];[self.wkWebView evaluateJavaScript:[NSString stringWithFormat:@"setValueDateA([%@])",_valueDatA] completionHandler:^(id dict, NSError * error) {NSLog(@"%@",error);}];[self.wkWebView evaluateJavaScript:[NSString stringWithFormat:@"setValueDateB([%@])",_valueDatB]completionHandler:^(id dict, NSError * error) {NSLog(@"%@",error);}];[self.wkWebView evaluateJavaScript:[NSString stringWithFormat:@"setValueDateC([%@])",_valueDatC] completionHandler:^(id dict, NSError * error) {NSLog(@"%@",error);}];[self.wkWebView evaluateJavaScript:[NSString stringWithFormat:@"setXAxisData([%@])",_xAxis]completionHandler:^(id dict, NSError * error) {NSLog(@"%@",error);}];[self.wkWebView evaluateJavaScript:[NSString stringWithFormat:@"setSubType('%@')",self.subType]completionHandler:^(id dict, NSError * error) {NSLog(@"%@",error);}];[self.wkWebView evaluateJavaScript:@"update()" completionHandler:^(id dict, NSError * error) {NSLog(@"%@",error);}];}-(void)setFrame:(CGRect)frame{frame.origin.y = frame.origin.y += 10;frame.size.height = frame.size.height -= 10;[super setFrame:frame];}- (void)setSelected:(BOOL)selected animated:(BOOL)animated {[super setSelected:selected animated:animated];// Configure the view for the selected state}- (IBAction)selectDay:(UIButton *)sender {sender.backgroundColor = SELECTBTN_BACKCOLOR;self.monthBtn.backgroundColor = BTN_BACKCOLOR;self.yearBtn.backgroundColor = BTN_BACKCOLOR;}- (IBAction)selectMonth:(UIButton *)sender {sender.backgroundColor = SELECTBTN_BACKCOLOR;self.dayBtn.backgroundColor = BTN_BACKCOLOR;self.yearBtn.backgroundColor = BTN_BACKCOLOR;}- (IBAction)selectYear:(UIButton *)sender {sender.backgroundColor = SELECTBTN_BACKCOLOR;self.monthBtn.backgroundColor = BTN_BACKCOLOR;self.dayBtn.backgroundColor = BTN_BACKCOLOR;}@end复制代码