Using DateTime Axis to populate x-axis


#1

Can someone please help me use the DateTimeAxis to populate the x-axis with all days of each month . My requirement is as follows :

1)For each month , each point on the x-axis should be a day on the month (Day 1 to Day 31st or 30th)

2)The days in the month should be represented as a day like ( Mon , tue , wed etc ) rather than (1 ,2, 3 etc)

3)All the points on the x-axis need to be plotted even though y-axis might not be available for all the days plotted on the x-axis

4)How will the x-axis be changed dynamically based on 31st or 30 th of each month ?

Below is my code : 

_xAxis =[[SChartDateTimeAxis alloc] init];
    _xAxis.style.lineColor =[UIColor colorWithWhite:0.5f alpha:1.0f];
    _xAxis.style.lineWidth =@1;
    _xAxis.style.majorTickStyle.showLabels = YES;
    _xAxis.style.majorTickStyle.labelFont =[UIFont systemFontOfSize:9];
    _xAxis.style.majorTickStyle.labelColor =[UIColor colorWithWhite:0.5f alpha:1.0f];
    _xAxis.style.majorTickStyle.showTicks = YES;
    _xAxis.style.majorTickStyle.lineWidth =@(1);
    _xAxis.style.majorTickStyle.lineColor = COLOR_BACKGROUND;

    _xAxis.labelFormatString =@"dd";

#2

![](file:///Users/simantinibhattacharya/Downloads/half_14177205795480b3034ece7.png)A very basic question , how do I insert a png file into this query ? I am sure that would help everyone understand the problem that I am facing :frowning:


#3

Hi there,

To insert an image you’ll need to upload it to a hosting service (e.g. imgur or dropbox) and then paste the URL to the image.

As for your questions,

  1. To represent the day in the month as mon, tues e.t.c you need to set the label format string to

    _xAxis.labelFormatString = @“E”;

Please see http://www.unicode.org/reports/tr35/tr35-19.html#Date_Format_Patterns for the other formats.

  1. You can plot nil values on the y axis as long as you supply a date for the x-axis e.g in schart:dataPointAtIndex:forSeriesAtIndex:

    SChartDataPoint *dp = [[SChartDataPoint alloc] init];
    dp.xValue = [NSDate date];
    dp.yValue = nil;

    return dp;

  2. I’m afraid I’m not completely sure I understand what you mean here. As we’re using NSDate objects the chart will know how many days are in each month automatically i.e. that April has 30 days and May has 31.

I hope the above helps you - please feel free to get back to us if you have any more questions!


#4

Thank you . Will try on points 1 and 2 and get back to you . Regarding point 3, whenever I try to assign a nil value to the y-axis the application crashes  at that point saying that the nil values are not allowed for the y-axis 


#5

Apologies, I was assuming you were using SChartLineSeries which shouldn’t crash when assigning a nil value to the datapoint’s yValue property. Have you tried assigning a value of 0 instead?


#6

Yes a zero works , but unfortunatelt it isnt the right representation of the data. For Eg : If on 28th of January I do not have corresponding data to plot on the y-axis , then if I feed in a 0 value, the graph would connect that data for  that day as 0 which is misleading. Basically it should not plot for that day and plot for all other days.

Using the SChartLineSeries can I plot the x-axis as days of the week (like Mon , Tue , Wed etc ?)


#7

Yes that should work.

Would you mind adding an image of what you’re trying to achieve as it might help avoid confusion for both of us?


#8

Please refer to the following images 

Image 1 -  Daily Graph View

Image 2 -  Weekly Graph View

Image 3 -  Monthly graph view

I have inserted 3 images corresponding to three graph views . Please focus on the bottom half of the screen which displays the graph 

Image 1 : This is a daily graph view. The X axis needs to show every 15 minutes starting from 12 AM to 12 AM of the day . The Y axis plots the corresponding value (In this graph its blood pressure values taken at specific intervals of the day ) .The requirement is on the x-axis I will need to display the points as 12AM , 12:15AM, 12:30AM … 11:45PM 12:00AM (The entire X-axis needs to show all these points ) . On the Y axis only those points will be plotted where there is a reading for the corresponding x-axis. And then all the points whould be connected via the line. (So allthough the X-axis shows all data points, the y-axis is plotted only for specific points on the x-axis)

Image 2 - Weekly view . The X-axis should plot the 7 days of the week and y axis the BP readings taken on the days. So if a specfic day of the week does not have a reading we will not have a datapoint for that day but the xaxis should still show the point. For eg if I do not have a reading on January 28th , then the x axis will still show (Sun, Mon, tue , wed , thur , fri  sat ,) [Corresponding to this week] and y axis will only have say 3 readings (assuming I got data only for 3 days of the week) . 

My Earlier code was : 

SChartCategoryAxis *xAxis = [[SChartCategoryAxisalloc] init];

    xAxis.rangePaddingHigh = @(0.5);

    xAxis.rangePaddingLow = @(0.5);

    // xAxis.style.interSeriesPadding = @0;

    xAxis.style.majorTickStyle.showTicks = YES;

    _shinobiChart.xAxis = xAxis;

SChartAxis *yAxis = [[SChartNumberAxisalloc] init];

    yAxis.rangePaddingHigh = @1.0;

    _shinobiChart.yAxis = yAxis;

//Getting the datapoint

SChartDataPoint* datapoint = [selfdataPointForValue:[NSNumbernumberWithInt:dayNumber] andValue: xx];

datapoint.xValue = @“Mon” //Sample day just for demo

With this what happened was , if in the week I had 2 readings on Monday and Thursday then the x-axis used to plot only 2 days and the remaining days (Tuesday , Wendnesday , Friday , Saturday , Sunday) was missing. Instead we need to show all 7 days on the x-axis and hence the requirement to add the nil value which always failed.

Sorry about the long post . Hope I have been able to explain the issue . Have been sitting on it for quite some time so any help will be highly appreciated


#9

In case the Images are not visble

Image 1 : https://www.dropbox.com/s/vajwxnmr0uhm5ez/graph_daily.png?dl=0

Image 2 : https://www.dropbox.com/s/0qt9ka9bchdhwg8/graph_weekly.png?dl=0

Image 3 : https://www.dropbox.com/s/37o4gnocfgrk24c/graph_monthly.png?dl=0


#10

You should just be able to not supply a datapoint for the date/time where a reading does not exist.

For example, for your month view, create an array of datapoints containing the readings you have e.g. every other day:

for (NSInteger i = 0; i < 30; i++) {
    // Only have a reading every other day from this date
    if (i % 2 == 0) {
        SChartDataPoint *dp = [SChartDataPoint new];
        dp.xValue = [NSDate dateWithTimeIntervalSinceNow:24*60*60 * i];
        dp.yValue = @(rand() % 100);

        [self.datapoints addObject:dp];
    }
}

Then use this array to populate your chart. You should be able to set the major tick frequency to your liking (e.g. 1 day / 15 minutes).

That should hopefully give you the result you’re after!