2015-09-07 166 views
3

編輯:問題中的例子純粹是爲了簡化它,但我不需要創建一條線,而是一條帶數據點的線。這就是爲什麼我需要使用圖庫。數據是動態的而不是靜態的。有些用戶建議我爲此使用圖片,但完全不是我所追求的。我想了解如何使用「iOS-charts」庫來繪製我想要的圖形。使用iOS圖表繪製多條線


項目鏈接:https://github.com/danielgindi/ios-charts

我使用的是iOS圖表庫創建具有多個線圖。我想有3行和20個數據點:

  • 線1:20倍的值與值1
  • 線2:20個值與值2
  • 線3:20個值與值1

我在iOS的github項目示例中修改了「LineChart2ViewController」示例,並且未能獲得我想要的結果。這就是我得到:

enter image description here

有什麼不對:

  • 線值的標籤是1,2和3,但y位置似乎是某處1和0.4之間。
  • 我得到的每個數據點的標籤(我想,而不是刪除的標籤,只顯示數據)

我怎樣才能做到這一點?


下面的修改後的代碼:

// Original code created by Daniel Cohen Gindi on 17/3/15. 
// 
// Copyright 2015 Daniel Cohen Gindi & Philipp Jahoda 
// A port of MPAndroidChart for iOS 
// Licensed under Apache License 2.0 
// 
// https://github.com/danielgindi/ios-charts 
// 

#import "LineChart2ViewController.h" 
#import "ChartsDemo-Swift.h" 

@interface LineChart2ViewController() <ChartViewDelegate> 

@property (nonatomic, strong) IBOutlet LineChartView *chartView; 
@property (nonatomic, strong) IBOutlet UISlider *sliderX; 
@property (nonatomic, strong) IBOutlet UISlider *sliderY; 
@property (nonatomic, strong) IBOutlet UITextField *sliderTextX; 
@property (nonatomic, strong) IBOutlet UITextField *sliderTextY; 

@end 

@implementation LineChart2ViewController 

- (void)viewDidLoad 
{ 
    [super viewDidLoad]; 

    self.title = @"Line compare"; 
    _chartView.delegate = self; 

    _chartView.descriptionText = @""; 
    _chartView.noDataTextDescription = @"You need to provide data for the chart."; 

    _chartView.highlightEnabled = YES; 
    _chartView.dragEnabled = YES; 
    [_chartView setScaleEnabled:YES]; 
    _chartView.drawGridBackgroundEnabled = NO; 
    _chartView.pinchZoomEnabled = YES; 

    _chartView.backgroundColor = [UIColor colorWithWhite:204/255.f alpha:1.f]; 

    _chartView.legend.form = ChartLegendFormLine; 
    _chartView.legend.font = [UIFont fontWithName:@"HelveticaNeue-Light" size:11.f]; 
    _chartView.legend.textColor = UIColor.whiteColor; 
    _chartView.legend.position = ChartLegendPositionBelowChartLeft; 

    ChartXAxis *xAxis = _chartView.xAxis; 
    xAxis.labelFont = [UIFont systemFontOfSize:12.f]; 
    xAxis.labelTextColor = UIColor.whiteColor; 
    xAxis.drawGridLinesEnabled = NO; 
    xAxis.drawAxisLineEnabled = NO; 
    xAxis.spaceBetweenLabels = 1.0; 

    ChartYAxis *leftAxis = _chartView.leftAxis; 
    leftAxis.labelTextColor = [UIColor colorWithRed:51/255.f green:181/255.f blue:229/255.f alpha:1.f]; 
    leftAxis.customAxisMax = 3; 
    leftAxis.drawGridLinesEnabled = YES; 

    ChartYAxis *rightAxis = _chartView.rightAxis; 
    rightAxis.labelTextColor = UIColor.redColor; 
    rightAxis.customAxisMax = 20.0; 
    rightAxis.startAtZeroEnabled = NO; 
    rightAxis.customAxisMin = 0.0; 
    rightAxis.drawGridLinesEnabled = NO; 
    [rightAxis setEnabled:NO]; 

    [self setDataCount:20 range:4]; 

    [_chartView animateWithXAxisDuration:2.5]; 
} 

- (void)didReceiveMemoryWarning 
{ 
    [super didReceiveMemoryWarning]; 
    // Dispose of any resources that can be recreated. 
} 

- (void)setDataCount:(int)count range:(double)range 
{ 
    NSMutableArray *xVals = [[NSMutableArray alloc] init]; 

    for (int i = 0; i < count; i++) 
    { 
     [xVals addObject:[@(i) stringValue]]; 
    } 

    NSMutableArray *yVals = [[NSMutableArray alloc] init]; 

    for (int i = 0; i < count; i++) 
    { 
     //double val = (double) (arc4random_uniform(range)); 
     double val = 1.0; 
     [yVals addObject:[[ChartDataEntry alloc] initWithValue:val xIndex:i]]; 
    } 

    LineChartDataSet *set1 = [[LineChartDataSet alloc] initWithYVals:yVals label:@"Line 1"]; 
    set1.axisDependency = AxisDependencyLeft; 
    [set1 setColor:[UIColor colorWithRed:51/255.f green:181/255.f blue:229/255.f alpha:1.f]]; 
    [set1 setCircleColor:UIColor.whiteColor]; 
    set1.lineWidth = 2.0; 
    set1.circleRadius = 3.0; 
    set1.fillAlpha = 65/255.0; 
    set1.fillColor = [UIColor colorWithRed:51/255.f green:181/255.f blue:229/255.f alpha:1.f]; 
    set1.highlightColor = [UIColor colorWithRed:244/255.f green:117/255.f blue:117/255.f alpha:1.f]; 
    set1.drawCircleHoleEnabled = NO; 

    NSMutableArray *yVals2 = [[NSMutableArray alloc] init]; 

    for (int i = 0; i < count; i++) 
    { 
     double val = 2.0; 
     ChartDataEntry * dataEntry = [[ChartDataEntry alloc] initWithValue:val xIndex:i]; 
     [yVals2 addObject:dataEntry]; 
    } 

    LineChartDataSet *set2 = [[LineChartDataSet alloc] initWithYVals:yVals2 label:@"Line 2"]; 
    set2.axisDependency = AxisDependencyRight; 
    [set2 setColor:UIColor.redColor]; 
    [set2 setCircleColor:UIColor.whiteColor]; 
    set2.lineWidth = 2.0; 
    set2.circleRadius = 3.0; 
    set2.fillAlpha = 65/255.0; 
    set2.fillColor = UIColor.redColor; 
    set2.highlightColor = [UIColor colorWithRed:244/255.f green:117/255.f blue:117/255.f alpha:1.f]; 
    set2.drawCircleHoleEnabled = NO; 

    NSMutableArray *yVals3 = [[NSMutableArray alloc] init]; 

    for (int i = 0; i < count; i++) 
    { 
     double val = 3.0; 
     [yVals3 addObject:[[ChartDataEntry alloc] initWithValue:val xIndex:i]]; 
    } 

    LineChartDataSet *set3 = [[LineChartDataSet alloc] initWithYVals:yVals3 label:@"Line 3"]; 
    set3.axisDependency = AxisDependencyRight; 
    [set3 setColor:UIColor.blueColor]; 
    [set3 setCircleColor:UIColor.whiteColor]; 
    set3.lineWidth = 2.0; 
    set3.circleRadius = 3.0; 
    set3.fillAlpha = 65/255.0; 
    set3.fillColor = UIColor.blueColor; 
    set3.highlightColor = [UIColor colorWithRed:244/255.f green:117/255.f blue:117/255.f alpha:1.f]; 
    set3.drawCircleHoleEnabled = NO; 

    NSMutableArray *dataSets = [[NSMutableArray alloc] init]; 
    [dataSets addObject:set1]; 
    [dataSets addObject:set2]; 
    [dataSets addObject:set3]; 

    LineChartData *data = [[LineChartData alloc] initWithXVals:xVals dataSets:dataSets]; 
    [data setValueTextColor:UIColor.whiteColor]; 
    [data setValueFont:[UIFont systemFontOfSize:9.f]]; 

    _chartView.data = data; 
} 
+0

你爲什麼不創建與網格線自定義的UIView? –

+0

這會破壞圖庫的作用。 – mm24

+0

你試過在ll2.valueFont = [UIFont systemFontOfSize:10.0]中給字體值0嗎? ? –

回答

3

由於@ T_77我通過設置字體大小設置爲0,代碼解決來自每個數據點移除標籤的第一個問題:

LineChartData *data = [[LineChartData alloc] initWithXVals:xVals dataSets:dataSets]; 
[data setValueTextColor:UIColor.whiteColor]; 
//[data setValueFont:[UIFont systemFontOfSize:9.f]]; 
[data setValueFont:[UIFont systemFontOfSize:0.0]]; 

然後我改變了axisDependencyLineChartDa ta設置爲AxisDependencyLeft以便我設置的值鏈接到左軸而不是x軸。

下面是代碼:

LineChartDataSet *set3 = [[LineChartDataSet alloc] initWithYVals:yVals3 label:@"Line 3"]; 
set3.axisDependency = AxisDependencyLeft; 

下面是結果:

enter image description here