Search code examples
iosobjective-cuibezierpath

UIBezierPath - smoothing chart of choppy/noisy data


My goal is to achieve Adobe Illustrator like lines when my user swipes across the screen. At the moment it's very choppy - here's a screenshot of the current situation:

Noisy lines

I think it's obvious what I want. I want those straight lines to be smoothed out. Is this called anti-aliasing?

- (void)touchesBegan: (CGPoint)point
{
    currentStroke = [[Stroke alloc] initWithStartPoint:point];
    [strokes addObject:currentStroke];
}

- (void)touchesMoved: (CGPoint)point
{
    if (!currentStroke) {
        [self touchesBegan:point];
    }
    [currentStroke.points addObject:[NSValue valueWithCGPoint:point]]
    pathTwo = [self createPath];
    [self scaleToFit];
    [self setNeedsDisplay];
}

- (UIBezierPath *)createPath {
    UIBezierPath * bezierPath = [UIBezierPath bezierPath];
    for (Stroke * stroke in strokes) {
        [bezierPath moveToPoint:stroke.startPoint];
        for (NSValue * value in stroke.points) {
            [bezierPath addLineToPoint:[value CGPointValue]];
        }
    }
    return bezierPath;
}

- (void)touchesEnded: (CGPoint)point
{
    [points removeAllObjects];
    [self setNeedsDisplay];
}

drawRect has this in it:

[[UIColor whiteColor] setStroke];
[pathTwo setLineWidth: _strokeWidth];
[pathTwo stroke];

EDIT

I think I have found my answer... https://github.com/jnfisher/ios-curve-interpolation

I just don't know how to use this given my createPath formula.

Maybe someone can help me plug in my arrays?


Solution

  • Thank you all for your support. I was away for a while. But I found a resolution to my situation that is phenomenal. It was a class that does interpolation.

    https://github.com/jnfisher/ios-curve-interpolation

    All I had to do was pass my array of Points and it smooths them out!