Flickering and Uneven X-Axis Labels (iOS charts v2.7.3x)


#1

I’ve recently updated from iOS ShinobiCharts Standard 2.57 to 2.7.3.  

The X-Axis (SChartDateTimeAxis) date labels are now sometimes drawn uneven and do a lot of flickering (like they are fighting for space) when panning left or right. You can see this in the image below how the first X axis label is drawn slightly lower than the rest. The label is also slightly offcenter from its tickmark compared to the others. Its inconsistent, sometimes it draws them correctly, sometimes it doesn’t, but there is almost always some flicker while panning.

Has anyone else seen this?

This happens with the iOS 2.7.3 hotfix1 as well.

Thank you.


#2

Hi cbolton,

This isn’t a known issue with the date-time axis. I believe there were a few date-time label fixes put in, in between the releases you mentioned, so this may be an edge case. Can I ask if it’s just a plain date-time axis, or are you using discontinuities? Would you be able to provide a datasource that generates data reproducing this issue? :slight_smile: This will help us get to the bottom of your issue as quickly as possible

Best regards,

Rob


#3

Thanks for the reply Rob.

This is a plain date-time axis, not discontinuous. The amount of flicker seems to vary based on the data pulled.

I can shrink it down to a sample project/datasource if needed, but it will be a few days until I can get to it.


#4

HI Cbolton,

It would be great if you could get us a sample project. Once we can replicate the issue on our side we’ll be able to look into fixing it! If you just send us an email (sample attached) to info@shinobicontrols.com refering this blog post, we’ll take a look.  :laughing:

Thanks,
Jan


#5

HI,

I also have this issue. In my line chart I display time only, like 10:50 AM:

chart

And when I swipe chart I see that sometimes (!) X axis labels jump forward and then back very fast. As far as I can see from my code (unfortunately, it’s too big to send) I do not re-draw chart. I mean, I only check when panning stops in

- (void)sChartDidFinishPanning:(ShinobiChart *)chart;

And that flickering happens only when I swipe/pan chart backward.


#6

Hi Nfloussov,

You don’t need to send your entire code base over. You can simply take one of our sample applications an modify it to artificially replicate your problem scenario. For example you could take the GettingStarted sample and do the follow:

  • Replace the number axes with date axes.
  • Generate sample data for your chart where your Y value is a random number and your X values are dates. These dates should be between the first & last dates of your actual data set, and any number of random dates inbetween.

At this point you’ll have a sample application that you’ll be able to send over. We’ll then be able to take a look at it first hand, see your issue & hopefully have a look at fixing it!

Jan


#7

OK,

I did it - took  GettingStarted  (from hotfix1-1 package) as the base and update it a bit.

  1. added <SChartDelegate>

  2. added @property (nonatomic)NSDateFormatter *stampFormatter; in ViewController.mfile.

  3. disabled (set to NOenableGestureZoomingfor both axes and enableGesturePanningfor Y axis for convinience.

  4. initialized formatter in viewDidLoad :

     [selfsetStampFormatter:[[NSDateFormatteralloc] init]];
      [[selfstampFormatter] setDateFormat:@"h:mm"];
      [[selfstampFormatter] setTimeZone:[NSTimeZonesystemTimeZone]];
    
  5. added  -(void)sChart:(ShinobiChart *)chart alterTickMark:(SChartTickMark *)tickMark beforeAddingToAxis:(SChartAxis *)axis

    • (void)sChart:(ShinobiChart *)chart alterTickMark:(SChartTickMark *)tickMark beforeAddingToAxis:(SChartAxis *)axis {

      if ([axis isXAxis] == YES) {
      NSDate now = [NSDate dateWithTimeIntervalSinceNow:tickMark.value60];
      [tickMark.tickLabel setText:[self.stampFormatter stringFromDate:now]];
      [tickMark.tickLabel setFont:[UIFont fontWithName:@“AvenirNext-Medium” size:13.0f]];
      CGRect labelFrame = tickMark.tickLabel.frame;
      labelFrame.size.width = 70.0f;
      [tickMark.tickLabel setFrame:labelFrame];
      CGRect currentFrame = tickMark.tickLabel.frame;
      tickMark.tickLabel.frame = CGRectMake(currentFrame.origin.x, currentFrame.origin.y-7, currentFrame.size.width, currentFrame.size.height);
      }

 }

Run from Xcode 6.1.1 on iPad 2 (8.1) simulator. As the result if you slowly pan chart from left to righ at certain moment X tickmarks will jitter. It does not happen when panning in backward direction.


#8

Hello nfloussov,

In case it helps you or anyone else who reads this post, the solution I got back from Shinobi regarding my original problem had to do with how I was setting the center of the tickLabel in beforeAddingToAxis. In my particular case, the following code resolved the problem:

    if ([axis isXAxis])

    {

        tickMark.tickLabel.numberOfLines = 2;

        [tickMark.tickLabel sizeToFit];

        CGPoint centre = tickMark.tickMarkView.center;

        centre.y =

        CGRectGetMaxY(axisChart.canvas.glView.frame)  +

        CGRectGetHeight(tickMark.tickLabel.frame)/2.f +

        CGRectGetHeight(tickMark.tickMarkView.frame);   

        tickMark.tickLabel.center = centre;

    }

I think in some older versions of Shinobi you could get away with an “off-center center” ticklabel, but the more recent versions are a little more finicky.


#9

Hi cbolton ,

thanks for the idea. But I’m not sure if we may use Shinobi OpenGL implementation. I mean, Shinobi should provide an API for us otherwise we may see other issues. For examle, why method does  sizeToFit  not set up center properly, and we have to (re)adjust it later on?

P.S. and becides, I have problem with X direction - X axis jumps back and force


#10

Hi nfloussov,

I’ve not been able to reproduce your issue from the code you have supplied, so it’s difficult to say for sure if your issue is the same as cbolton’s. Allowing us to directly debug the problem would enable us to get a solution out to you much quicker - you can help us do this as per Jan’s suggestion of modifying a sample and then sending the whole sample to info@shinobicontrols.com. If you do this it would be great if you could also include a link to this thread for reference.

With regards to your other comments:

" Shinobi should provide an API for us otherwise we may see other issues"

We’re always open to suggestions on how we can improve our products, and we think your suggestion of making tick labels easier to position is a good one. So we’d love to hear any further comments or thoughts you might have on what this API might look like.

" why method does sizeToFit not set up center properly"

I think that sizeToFit is a UIKit method that just alters the size of the receiver based on its content and no positioning is done. If you resize something that is meant to be positioned relative to its centre then it will also need to be repositioned.

I hope the above information is useful! Don’t hesitate to email your sample project into us and we’ll begin taking a look asap! :slight_smile:

Thanks

Ryan