Showing Negative and Positive Values in Line or Area Charts

4 posts, 0 answers
  1. Sal
    Sal avatar
    58 posts
    Member since:
    Feb 2015

    Posted 31 Aug 2015 Link to this post

    I have two questions, the first being if there's a way to show negative and positive values on the same chart ((I'm trying to show daily transaction details so some days will have negative values and others will have positive values). I don't know if it's due to how I setup the datapoint (I'm just passing the number over as a string so maybe I need to convert it to a float or int value) or if it's something extra I need to do when setting up the axes. 

     

    The second question is in regards to the y-axes, I only want to show the lowest and highest point of the chart (so I don't have a long series of labels as in the screenshot below at after a couple weeks). I don't know if it's due to the amount of labels that are being show but as more data is added the chart itself starts to get smaller and pushed further to the right hand side of my view, where when I have just a few points in fills in the whole view. I am using the newest version of the Telerik controls as well just in case anyone thinks that's an issue. 

  2. Sophi
    Admin
    Sophi avatar
    99 posts

    Posted 01 Sep 2015 Link to this post

    Hello Sal,
    Thank you for contacting us.

    Yes, there is a way to show negative and positive value on the same axis. You should use TKChartNumericAxis and the values of your TKChartDataPoint should be NSNumbers. The axis will arrange the numbers in the correct order.
    TKChartNumericAxis *yAxis = [[TKChartNumericAxis alloc] init];
    _chart.yAxis = yAxis;

    On your second question, you can manipulate the shown value interval and the size of the ticks of the axes.
    You should use majorTickInterval property to change the distance between the shown points. The code below results in showing the data points on the xAxis with interval of 20.
    TKChartNumericAxis *xAxis = [[TKChartNumericAxis alloc] init];
    xAxis.majorTickInterval = @20;
    _chart.xAxis = xAxis;

    In order to show only specific interval of your axis you should initialize it with minimum and maximum:
    TKChartNumericAxis *yAxis = [[TKChartNumericAxis alloc] initWithMinimum:@(-100) andMaximum:@(100)];

    I hope this helps. If you have any other questions, do not hesitate to contact us.

    Regards,
    Sophi
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. DevCraft banner
  4. Sal
    Sal avatar
    58 posts
    Member since:
    Feb 2015

    Posted 01 Sep 2015 in reply to Sophi Link to this post

    Thanks Sophi, the first issue was fixed by formatting the datapoint to a NSNumber and using the ChartNumericAxis but let me clarify the second issue a little bit more. I'm not worried about the range that is used, what I want to do is only show the minimum and maximum label, while the rest of the labels for all the other majorTicks is blank/hidden. Is there a way to do this or do I need to adopt a delegate method and go through each one hiding the ones I don't want to display? 
  5. Sophi
    Admin
    Sophi avatar
    99 posts

    Posted 02 Sep 2015 Link to this post

    Hi Sal,

    The easiest way to do this is by setting the majorTickInterval property of the axis. It controls the interval used to place axis ticks. Here is an example:
    TKChartNumericAxis *axis = (TKChartNumericAxis*)_chart.xAxis;
    axis.majorTickInterval = @([axis.range.maximum doubleValue] - [axis.range.minimum doubleValue]);

    As you suggested, another option is adopting TKChartDelegate and implementing the chart:textForAxis:value:atIndex: method that will allow you to iterate over axis labels and return empty text for the ones you do not need. Consider the following snippet:
    -(NSString *)chart:(TKChart *)chart textForAxis:(TKChartAxis *)axis value:(id)value atIndex:(NSUInteger)index
    {
        if ([axis isKindOfClass:[TKChartNumericAxis class]]){
            if (index == 0 || index == maximumIndex)
            {
                NSNumber *n = (NSNumber*)value;
                return [NSString stringWithFormat:@"%@",n];
            }
             
            return @"";
        }
        return value;
    }

    I hope this covers your case.

    Regards,
    Sophi
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
DevCraft banner