FSLineChart A line chart library for iOS.

Related tags

Charts FSLineChart
Overview

FSLineChart

A line chart library for iOS.

Screenshots

 

Installing FSLineChart

Add the contents of the FSLineChart project to your directory or simply add the following line to your Podfile:

pod "FSLineChart"

How to use

FSLineChart is a subclass of UIView so it can be added as regular view. The block structure allows you to format the values displayed on the chart the way you want. Here is a simple swift example:

var data: [Int] = []
        
// Generate some dummy data
for _ in 0...10 {
    data.append(Int(20 + (arc4random() % 100)))
}

verticalGridStep = 5
horizontalGridStep = 9
labelForIndex = { "\($0)" }
labelForValue = { "$\($0)" }
setChartData(data)

Or in objective-c

NSArray* months = @[@"January", @"February", @"March", @"April", @"May", @"June", @"July"];
    
FSLineChart* lineChart = [[FSLineChart alloc] initWithFrame:frame];

lineChart.labelForIndex = ^(NSUInteger item) {
    return months[item];
};

lineChart.labelForValue = ^(CGFloat value) {
    return [NSString stringWithFormat:@"%.02f", powf(10,value)];
};

[lineChart setChartData:chartData];

You can also set several parameters. Some of the parameters including color and fillColor must be set before calling the setChartData method. All those properties are available:

// Index label properties
@property (copy) FSLabelForIndexGetter labelForIndex;
@property (nonatomic, strong) UIFont* indexLabelFont;
@property (nonatomic) UIColor* indexLabelTextColor;
@property (nonatomic) UIColor* indexLabelBackgroundColor;

// Value label properties
@property (copy) FSLabelForValueGetter labelForValue;
@property (nonatomic, strong) UIFont* valueLabelFont;
@property (nonatomic) UIColor* valueLabelTextColor;
@property (nonatomic) UIColor* valueLabelBackgroundColor;
@property (nonatomic) ValueLabelPositionType valueLabelPosition;

// Number of visible step in the chart
@property (nonatomic) int gridStep;
@property (nonatomic) int verticalGridStep;
@property (nonatomic) int horizontalGridStep;

// Margin of the chart
@property (nonatomic) CGFloat margin;

@property (nonatomic) CGFloat axisWidth;
@property (nonatomic) CGFloat axisHeight;

// Decoration parameters, let you pick the color of the line as well as the color of the axis
@property (nonatomic, strong) UIColor* axisColor;
@property (nonatomic) CGFloat axisLineWidth;

// Chart parameters
@property (nonatomic, strong) UIColor* color;
@property (nonatomic, strong) UIColor* fillColor;
@property (nonatomic) CGFloat lineWidth;

// Data points
@property (nonatomic) BOOL displayDataPoint;
@property (nonatomic, strong) UIColor* dataPointColor;
@property (nonatomic, strong) UIColor* dataPointBackgroundColor;
@property (nonatomic) CGFloat dataPointRadius;

// Grid parameters
@property (nonatomic) BOOL drawInnerGrid;
@property (nonatomic, strong) UIColor* innerGridColor;
@property (nonatomic) CGFloat innerGridLineWidth;

// Smoothing
@property (nonatomic) BOOL bezierSmoothing;
@property (nonatomic) CGFloat bezierSmoothingTension;

// Animations
@property (nonatomic) CGFloat animationDuration;

Examples

You can clone the repo to see a simple example. I'm also using FSLineChart on ChartLoot if you want to see the integration in a bigger project.

Comments
  • Minimum Y-value greater than zero?

    Minimum Y-value greater than zero?

    Sorry, another question. Is there a way to have the graph's y-axis not start at zero? I have a data set that ranges from 20000-25000, and don't want all of the excess displayed.

    opened by canyondellomo 20
  • Seems crash when all data are zero

    Seems crash when all data are zero

    NSMutableArray* chartData = [NSMutableArray arrayWithCapacity:10]; srand(time(nil)); for(int i=0;i<10;i++) { int r = (rand() + rand()) % 1000; chartData[i] = [NSNumber numberWithInt:0]; } // Creating the line chart FSLineChart* lineChart = [[FSLineChart alloc] initWithFrame:CGRectMake(20, 60, [UIScreen mainScreen].bounds.size.width - 40, 166)]; lineChart.verticalGridStep = 5; lineChart.horizontalGridStep = 9; //lineChart.fillColor = nil; lineChart.labelForIndex = ^(NSUInteger item) { return [NSString stringWithFormat:@"%lu",(unsigned long)item]; }; lineChart.labelForValue = ^(CGFloat value) { return [NSString stringWithFormat:@"%.f", value]; }; [lineChart setChartData:chartData]; return lineChart;

    I replace all the data point with 0 in the example project and the app crashed. Here is the failure information:

    Assertion failed: (CGFloatIsValid(x) && CGFloatIsValid(y)), function void CGPathMoveToPoint(CGMutablePathRef, const CGAffineTransform *, CGFloat, CGFloat), file Paths/CGPath.cc, line 254.

    opened by zenghaojim33 9
  • Precision from float value with 4 digits?

    Precision from float value with 4 digits?

    Hi there,

    First of all, thank you for this great library.

    I got a question about the precision of the float, when I set the CGFloat value to .4f it doesn't return the last 2 digits as seen on the screenshot, this results in 0.

    Also the chart is showing almost a straight line because it doesn't measure the last 2 digits while the last two digits are very important.

    self.lineChart.labelForValue = ^(CGFloat value) {
    return [NSString stringWithFormat:@"€ %.4f", value];
    };
    
    schermafbeelding 2016-10-28 om 17 09 47
    opened by Alifar 4
  • Can i reload Chart with some updated data?

    Can i reload Chart with some updated data?

    Hi, does FSLineChart support reloading ( using for example NSTimer ) chart with updated data ?

    More in depth: can i reload chart every seconds with new data ?

    opened by AlessandroFronteddu 4
  • Calling setChartData: with an array containing one data point will crash the chart

    Calling setChartData: with an array containing one data point will crash the chart

    In a number of locations, calculations are done using (_data.count - 1), e.g. line 134 (https://github.com/ArthurGuibert/FSLineChart/blob/master/FSLineChart/FSLineChart/FSLineChart.m#L134).

    There are a number of other locations where this assumption (_data.count > 1) is made. The crashes are happening because these calculated values end up being NaN.

    In addition to empty data arrays, it looks like the code needs to safeguard against data arrays containing one value.

    opened by 4Kicks 3
  • months(labelForIndex) can't be two objects?

    months(labelForIndex) can't be two objects?

    • (void)loadChartWithDates {

      NSArray *chartData=@[@"78",@"23"];

      NSArray* months = @[@"2016-05-23", @"2016-05-24"];

      // Setting up the line chart _chartWithDates.verticalGridStep = 6; _chartWithDates.horizontalGridStep = 3; _chartWithDates.fillColor = nil; _chartWithDates.displayDataPoint = YES; _chartWithDates.dataPointColor = [UIColor fsOrange]; _chartWithDates.dataPointBackgroundColor = [UIColor fsOrange]; _chartWithDates.dataPointRadius = 2; _chartWithDates.color = [_chartWithDates.dataPointColor colorWithAlphaComponent:0.3]; _chartWithDates.valueLabelPosition = ValueLabelLeftMirrored;

      _chartWithDates.labelForIndex = ^(NSUInteger item) { return months[item]; };

      _chartWithDates.labelForValue = ^(CGFloat value) { return [NSString stringWithFormat:@"%.f", value]; };

      [_chartWithDates setChartData:chartData]; }

    if NSArray chartData=@[@"78",@"23"]; NSArray months = @[@"2016-05-23", @"2016-05-24"]; the second object 2016-05-24 can't be load ? why?

    opened by sp55 2
  • 'clearChartData:' doesn't work

    'clearChartData:' doesn't work

    When I call the method ''clearChartData:', the chart will draw again.

    The method 'drawRect:' will call to redraw.

    So I can't clear the chart.

    Help me, thanks.

    opened by shz2050 2
  • Cannot change axis

    Cannot change axis

    Changing chart parameters is not possible after adding chart data. A workaround is this hack which resets the whole chart:

    FSLineChart *newChart = [[FSLineChart alloc] initWithFrame:self.lineChartFull.frame];
    [self.lineChartFull removeFromSuperview];
    [self.view addSubview:newChart];
    self.lineChartFull = newChart;
    
    opened by fulldecent 2
  • add UIGraphicsPopContext

    add UIGraphicsPopContext

    hi, the function drawGrid of FSLineChart,

    since it invoke : UIGraphicsPushContext(ctx); so have to release it as follows:

    //@step should be pop to release
    UIGraphicsPopContext();
    

    or else memory leak ?

    opened by icoco 1
  • Change the entire background color of chart?

    Change the entire background color of chart?

    Maybe not an issue, but I can't figure out how to change the background. Ideally, reduce the alpha, but I can live with setting it to black. Is there a way to do that?

    opened by canyondellomo 1
  • No way to use with storyboards

    No way to use with storyboards

    Need

    - (void)awakeFromNib
    {
        self.backgroundColor = [UIColor whiteColor];
        [self setDefaultParameters];
    }
    

    In FSLineChart.m in order to set up defaults.

    opened by anToha 1
  • How to set a max value for x axis

    How to set a max value for x axis

    I want to set a different values value for x-axis which may not be present in the x-axis value array. Example : I want to set 1500 as my total distance and I may get y values till 120 in my x-axis value array. How to set a max value for x axis?

    opened by lakshmii 0
  • Value for each point

    Value for each point

    Hello, I would like to present on the graph the value of each specific point that I plot. Is there any way to do this? Maybe showing a label on top of each point with its value, or, on the Y-axis, instead of presenting a series of steps, is there any way to show the value of the point? Do you understand what I mean? Thank you in advance for your help, and @ArthurGuibert, Thank you for the framework! It is great!

    opened by JuanchoPestana 0
  • Getting strange behaviour when value goes above 10?

    Getting strange behaviour when value goes above 10?

    schermafbeelding 2017-06-20 om 22 46 41

    See image, why am I getting this behaviour when it goes up 10?

    See my code below:

    float n = [[sort objectAtIndex:0] floatValue];
            
            NSString* forFloat = [NSString stringWithFormat:@"%.3f", n];
            lowFloat = [forFloat floatValue]-0.001;
    
    NSMutableArray* chartData = [NSMutableArray arrayWithCapacity:self.lineData.count];
                NSMutableArray* months = [NSMutableArray arrayWithCapacity:self.lineData.count];
                for(int i=0;i<self.lineData.count;i++) {
                    
                    Kobject *z = [self.lineData objectAtIndex:i];
                    chartData[i] = [NSNumber numberWithFloat:[z.oPrice floatValue]-lowFloat];
                    months[i] = z.oDate;
                }
                
                self.lineChart = [[FSLineChart alloc] initWithFrame:CGRectMake(15, 44, [UIScreen mainScreen].bounds.size.width - 30, 120)];
                self.lineChart.verticalGridStep = 6;
                self.lineChart.horizontalGridStep = 7;
                self.lineChart.fillColor = [UIColor colorWithRed:0.24 green:0.72 blue:0.68 alpha:0.20];
                self.lineChart.color = [self.lineChart.dataPointColor colorWithAlphaComponent:0.3];
                self.lineChart.valueLabelPosition = ValueLabelLeftMirrored;
                self.lineChart.indexLabelFont = [UIFont fontWithName:@"HelveticaNeue-Light" size:10];
                self.lineChart.valueLabelFont = [UIFont fontWithName:@"HelveticaNeue-Light" size:9];
                self.lineChart.labelForIndex = ^(NSUInteger item) {
                    return months[item];
                };
                self.lineChart.labelForValue = ^(CGFloat value) {
                    
                    return [NSString stringWithFormat:@"$ %.2f", value+lowFloat];
                };
                [self.lineChart setChartData:chartData];
                [view addSubview:self.lineChart];
    
    opened by Alifar 0
Owner
Arthur
Arthur
SwiftUI library to easily render diagrams given a tree of objects. Similar to ring chart, sunburst chart, multilevel pie chart.

Swift Sunburst Diagram Sunburst diagram is a library written with SwiftUI to easily render diagrams given a tree of objects. Similar to ring chart, su

Ludovic Landry 494 Dec 19, 2022
Line Chart library for iOS written in Swift

Swift LineChart Usage var lineChart = LineChart() lineChart.addLine([3, 4, 9, 11, 13, 15]) Features Super simple Highly customizable Auto scaling Touc

Mirco Zeiss 601 Nov 15, 2022
A powerful 🚀 Android chart view / graph view library, supporting line- bar- pie- radar- bubble- and candlestick charts as well as scaling, panning and animations.

⚡ A powerful & easy to use chart library for Android ⚡ Charts is the iOS version of this library Table of Contents Quick Start Gradle Maven Documentat

Philipp Jahoda 36k Jan 5, 2023
Demonstrate a way to build your own line chart without using any third-party library

LineChart This code demonstrate a way to build your own line chart without using any third-party library. It contains a simple yet effective algorithm

Van Hung Nguyen 0 Oct 17, 2021
ANDLineChartView is easy to use view-based class for displaying animated line chart.

ANDLineChartView for iOS ANDLineChartView is easy to use view-based class for displaying animated line chart. Usage API is simple. Just implement foll

Andrzej Naglik 421 Dec 11, 2022
An interactive line chart written in SwiftUI with many customizations.

LineChartView LineChartView is a Swift Package written in SwiftUI to add a line chart to your app. It has many available customizations and is interac

Jonathan Gander 59 Dec 10, 2022
Fully customizable line chart for SwiftUI 🤩

?? CheesyChart Create amazing Crypto and Stock charts ?? ?? Looking for an easy to use and fully customizable charting solution written in SwiftUI? Th

adri567 13 Dec 14, 2022
Easy to use Spider (Radar) Chart library for iOS written in Swift.

DDSpiderChart Easy to use Spider (Radar) Chart library for iOS written in Swift. Requirements iOS 8.0+ / macOS 10.10+ / tvOS 9.0+ / watchOS 2.0+ Xcode

Deniz Adalar 82 Nov 14, 2022
Core Charts | Basic Scrollable Chart Library for iOS

Core Charts | Basic Chart Library for iOS HCoreBarChart VCoreBarChart Requirements Installation Usage Appearance Customization Getting Started You nee

Çağrı ÇOLAK 71 Nov 17, 2022
MSBBarChart is an easy to use bar chart library for iOS

MSBBarChart MSBBarChart is an easy to use bar chart library for iOS. Usage if you want to hide label above bar barChart.setOptions([.isHiddenLabelAbov

misyobun 45 May 3, 2022
A simple and beautiful chart lib used in Piner and CoinsMan for iOS(https://github.com/kevinzhow/PNChart) Swift Implementation

PNChart-Swift PNChart(https://github.com/kevinzhow/PNChart) Swift Implementation Installation This isn't on CocoaPods yet, so to install, add this to

Kevin 1.4k Nov 7, 2022
A simple and beautiful chart lib used in Piner and CoinsMan for iOS

PNChart You can also find swift version at here https://github.com/kevinzhow/PNChart-Swift A simple and beautiful chart lib with animation used in Pin

Kevin 9.8k Jan 6, 2023
iOS Chart. Support animation, click, scroll, area highlight.

XJYChart XJYChart - A High-performance, Elegant, Easy-to-integrate Charting Framework. The Best iOS Objc Charts. chart more beautiful support chart sc

junyixie 868 Nov 16, 2022
A simple and animated Pie Chart for your iOS app.

XYPieChart XYPieChart is an simple and easy-to-use pie chart for iOS app. It started from a Potion Project which needs an animated pie graph without i

XY Feng 1.7k Sep 6, 2022
iOS/iPhone/iPad Chart, Graph. Event handling and animation supported.

#EChart A highly extendable, easy to use chart with event handling, animation supported. ##Test How To Use Download and run the EChartDemo project is

Scott Zhu 646 Dec 27, 2022
an iOS open source Radar Chart implementation

JYRadarChart an open source iOS Radar Chart implementation ##Screenshots Requirements Xcode 5 or higher iOS 5.0 or higher ARC CoreGraphics.framework D

Johnny Wu 416 Dec 31, 2022
candlestick chart for ios

###Licenses (The MIT License) Copyright ©2012 zhiyu zheng all rights reserved. Permission is hereby granted, free of charge, to any person obtaining a

ZhiYu 962 Oct 17, 2022
A simple pie chart for iOS.

EGPieChart Installation EGPieChart is available through CocoaPods. To install it, simply add the following line to your Podfile: pod 'EGPieChart' manu

Ethan Guan 3 Nov 29, 2021
TKRadarChart - A customizable radar chart in Swift

TKRadarChart A customizable radar chart in Swift Requirements iOS 8.0+ Xcode 9.0 Swift 4.0 Installation CocoaPods You can use CocoaPods to install TKR

TBXark 203 Dec 28, 2022