UUChart的使用

一、簡介

    UUChart是一個用于繪制圖表的第三方，尤其適合去繪制折線圖。自己再做一個醫院相關的項目時，需要對一周內的血壓進行監控，需要繪制折線圖來表示出高壓、低壓的走向，因此學習了一下。

二、下載地址：

    https://github.com/ZhipingYang/UUChartView

三、使用

    第一步、首先我們將下載下來的文件解壓，里面有一個UUChar的文件夾，然后將整個文件夾都拖到項目里面。我們會發現里面有UUBar.h、UUChart.h等文件，這些就是UUChart的具體實現。

    第二步、我們需要在引用的.h文件中引入

        #import “UUChart.h"

    然后實現代理

@interface BloodPressureViewController : BaseViewController<UUChartDataSource,RequestDelegate>

    然后我們需要實例化一個UUChart.我自己實例化的是：UUChart *bloodPressureCharView;

    實例化三個數組：

    NSMutableArray *xValues;   //這個是橫坐標的內容
    NSMutableArray *yValues1;  //這個是豎坐標的內容（高壓）
 

    NSMutableArray *yValues2;  //這個是豎坐標的內容（低壓）

    第三步、實現代理方法

    #pragma mark - UUCharView Delegate//該方法是返回實例化的折線圖的橫坐標-(NSArray *)UUChart_xLableArray:(UUChart *)chart

{    return xValues;

  

}//該方法是返回實例化的折線圖的豎坐標（若返回一個就是一條折線圖，我這里需要顯示高壓低壓，所以返回了兩個）-(NSArray *)UUChart_yValueArray:(UUChart *)chart

{   

    return @[yValues1,yValues2];

}//這里返回縱坐標的范圍。-(CGRange)UUChartChooseRangeInLineChart:(UUChart *)chart

{    return CGRangeMake(200,0);

}//這里用于設置是否顯示最大值最小值。

 -(BOOL)UUChart:(UUChart *)chart ShowMaxMinAtIndex:(NSInteger)index

{    return YES;

}//顏色數組- (NSArray *)UUChart_ColorArray:(UUChart *)chart

{    return @[UUGreen,UURed,UUBrown];

}- (BOOL)UUChart:(UUChart *)chart ShowHorizonLineAtIndex:(NSInteger)index

{    return YES;

}

   第四步、我們把自己需要設置的數據放入三個數組中即可。 

題外話，我自己需要一個功能就是把所有的折線圖中的點的縱坐標都顯示出來，所以對UUChart稍加修改即可。修改方法如下：

    找到UULineChar.m然后找到如下代碼：

- (void)addPoint:(CGPoint)point index:(NSInteger)index isShow:(BOOL)isHollow value:(CGFloat)value

{

    UIView *view = [[UIView alloc]initWithFrame:CGRectMake(5, 5, 8, 8)];

    view.center = point;

    view.layer.masksToBounds = YES;

    view.layer.cornerRadius = 4;

    view.layer.borderWidth = 2;

    view.layer.borderColor = [[_colors objectAtIndex:index] CGColor]?[[_colors objectAtIndex:index] CGColor]:UUGreen.CGColor;    

    if (isHollow) {

        view.backgroundColor = [UIColor whiteColor];

    }else{

        view.backgroundColor = [_colors objectAtIndex:index]?[_colors objectAtIndex:index]:UUGreen;

        UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(point.x-UUTagLabelwidth/2.0, point.y-UULabelHeight*2, UUTagLabelwidth, UULabelHeight)];

        label.font = [UIFont systemFontOfSize:10];

        label.textAlignment = NSTextAlignmentCenter;

        label.textColor = view.backgroundColor;

        label.text = [NSString stringWithFormat:@"%d",(int)value];

        [self addSubview:label];

    }

 

    [self addSubview:view];

 

}

我們只需要把if else判斷去掉即可。即

- (void)addPoint:(CGPoint)point index:(NSInteger)index isShow:(BOOL)isHollow value:(CGFloat)value

{

    UIView *view = [[UIView alloc]initWithFrame:CGRectMake(5, 5, 8, 8)];

    view.center = point;

    view.layer.masksToBounds = YES;

    view.layer.cornerRadius = 4;

    view.layer.borderWidth = 2;

    view.layer.borderColor = [[_colors objectAtIndex:index] CGColor]?[[_colors objectAtIndex:index] CGColor]:UUGreen.CGColor;    

//    if (isHollow) {//        view.backgroundColor = [UIColor whiteColor];//    }else{
        view.backgroundColor = [_colors objectAtIndex:index]?[_colors objectAtIndex:index]:UUGreen;

        UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(point.x-UUTagLabelwidth/2.0, point.y-UULabelHeight*2, UUTagLabelwidth, UULabelHeight)];

        label.font = [UIFont systemFontOfSize:10];

        label.textAlignment = NSTextAlignmentCenter;

        label.textColor = view.backgroundColor;

        label.text = [NSString stringWithFormat:@"%d",(int)value];

        [self addSubview:label];//    }
    

    [self addSubview:view];

}

這樣就可以把所有點的縱坐標顯示出來了。效果如圖所示

另附請求處理源碼，希望大家用得到

 View Code