Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draw X-Axis labels with dates keeping index of x-axis independent like before #2648

Closed
iagarwal opened this issue Jul 28, 2017 · 4 comments
Closed

Comments

@iagarwal
Copy link

In our case, we have to draw line charts for monthly view & yearly view.
1.Monthly Chart : We can have 1-28 data points for drawing on y axis. But we have to keep our X-axis as fixed showing 4 Labels with interval of 7 days [week-wise date].
2.Yearly Chart : We can have 1-365 data points for drawing on y axis. But we have to keep our X-axis as fixed showing 12 Labels with interval of 28 days [month-wise date].

Now with latest update we can not keep x-axis separate & to show fixed labels , i've to add data points with 0 values.But this is not acceptable as per requirements.
Code used for

Please let me know how could i draw charts as shown in screenshot
monthchart

After updating with latest sdk 3.0.2, Below is code for drawing 1 month line chart

 ChartXAxis *xAxis = _cfChartView.lineChartView.xAxis;
 xAxis.granularityEnabled = YES;
 [xAxis setLabelCount:5 force:YES];
 xAxis.avoidFirstLastClippingEnabled = YES;
 
 NSMutableArray *xVals = [[NSMutableArray alloc] init];
 NSMutableArray *yVals = [[NSMutableArray alloc] init];
 NSDate *date = monthStartDate;
 
 NSInteger numberOfWeeks = 4;
 
 NSMutableArray *weekData = [NSMutableArray arrayWithCapacity:numberOfWeeks];
 
 NSTimeInterval timeAddition = 0;
 
 NSDate *currentDate = monthStartDate;
 if (dataSet.count>0) {
     _cfChartView.yLabel.hidden = NO;
     [yVals addObject:[[ChartDataEntry alloc] initWithX:0 y:0]];
//Added 28 data entries with 0 value to have 28 points on x-axis & then replaced 0 values with expected values on matching index..
     for (int i = 0; i < 28; i++)
     {
         // Edge case where beginning of week starts in the prior month
         NSDate *newFirstDate = [NSDate dateWithTimeInterval:(i*24*60*60) sinceDate:currentDate];
         [xVals addObject:[NSString stringWithFormat:@"%@",[CFCommonUtils dateStringWithDate:newFirstDate]]];
         [yVals addObject:[[ChartDataEntry alloc] initWithX:i+1 y:0]];
     }

     [xVals addObject:@""];

     for (FFGUserMetric *metric in dataSet) {
         if ([xVals containsObject:[NSString stringWithFormat:@"%@",[CFCommonUtils dateStringWithDate:metric.recordingDate]]]) {
         int index = [xVals indexOfObject:[NSString stringWithFormat:@"%@",[CFCommonUtils dateStringWithDate:metric.recordingDate]]];
         [yVals replaceObjectAtIndex:index withObject:[[ChartDataEntry alloc] initWithX:index y:metric.value]];
         }
     }
}
 
 LineChartDataSet *set = [[LineChartDataSet alloc] initWithValues:yVals label:nil];
 set.drawValuesEnabled = false;
 set.lineWidth = 2.0;
 [set setCircleRadius:2.0];
 
 UIColor *color = [UIColor whiteColor];
 [set setColor:color];
 [set setCircleColor:[UIColor whiteColor]];
 [set setCircleHoleColor:[UIColor cf_mediumGreenColor]];
 
 NSMutableArray *dataSets = [[NSMutableArray alloc] init];
 [dataSets addObject:set];
 if (dataSets && dataSets.count) {
     LineChartData *data = [[LineChartData alloc] initWithDataSets:dataSets];
     _cfChartView.lineChartView.xAxis.valueFormatter = [[ChartDefaultAxisValueFormatter alloc] initWithBlock:^NSString * _Nonnull(double index, ChartAxisBase * _axis) {
         NSLog(@"xAxis : %@ index:%d",xVals[(int)index],index);
         return xVals[(int)index];
     }];
     [data setValueFont:[UIFont fontWithName:@"HelveticaNeue-Light" size:10.f]];
     linechartView.data =  data;
 }
 
 linechartView.data =  nil;

It draws chart as continuous line
linechart1

@liuxuan30
Copy link
Member

liuxuan30 commented Aug 1, 2017

remember x axis in V3 behaves like y axis. So first only add (x,y) to where you need. If you need to 'break line', use one data set for each line segment.

Also remember to use valueFormatter to format. It's kind of tricky in V3

@iagarwal
Copy link
Author

iagarwal commented Aug 1, 2017

I am sorry , i didn't get you completely. Do you want to say that i don't need to add 28 points to show 4 labels on x -axis with interval?
Could you give me in example how to do that ? I am already using valueFormatter to display dates on specific indexes.

@liuxuan30
Copy link
Member

In your first image, there is only two points, so you only have to add two (x,y) in your data set and draw it.
For you second one, if you don't want the line connected with 0, you have to use two data sets, each set have two (x,y) so you have two line segments

@iagarwal
Copy link
Author

iagarwal commented Aug 23, 2017

Thanks for your reply. I got your point.
I've used two data sets now .One for keeping required fix points in X - Axis with clear line & one for actual points so that graphs will be shown the way it used to be.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants