Simple and intuitive iOS chart library. Contribution graph, clock chart, and bar chart.

Related tags

Charts TEAChart
Overview

TEAChart

Travis CI Version License Platform

Simple and intuitive iOS chart library, for Pomotodo app. Contribution graph, clock chart, and bar chart.

Supports Storyboard and is fully accessible to VoiceOver users.

Usage

The most convinient way is to use Storyboard, where you can set the attributes right in the Interface Builder.

Interface Builder

See the header files for complete documents.

Contribution Graph

Contribution Graph

The contribution graph mimics the GitHub one. You can implement the TEAContributionGraphDataSource protocol to provide data and customize the style of the graph. The required methods are:

// The DataSource should return an NSDate that occurs inside the month to graph
- (NSDate *)monthForGraph;

// The day variable is an integer from 1 to the last day of the month given by monthForGraph
// Return the value to graph for each calendar day or 0.
- (NSInteger)valueForDay:(NSUInteger)day;

There are currently three more DataSource methods to customize the coloring of the graph. Each grade is represented by a different color.

// Defines the number of distinct colors in the graph
- (NSUInteger)numberOfGrades;

// Defines what color should be used by each grade.
- (UIColor *)colorForGrade:(NSUInteger)grade;

// Defines the cutoff values used for translating values into grades.
// For example, you may want different grades for the values grade == 0, 1 <= grade < 5, 5 <= grade.
// This means there are three grades total
// The minimumValue for the first grade is 0, the minimum for the second grade is 1, and the minimum for the third grade is 5
- (NSInteger)minimumValueForGrade:(NSUInteger)grade;

There’s also a method to define the tap behavior on contribution graph cells:

- (void)dateTapped:(NSDictionary *)dict;

Here is a simple sample of implementing the delegate methods after connecting delegate in Interface Builder.

#pragma mark - TEAContributionGraphDataSource Methods

- (void)dateTapped:(NSDictionary *)dict
{
    NSLog(@"date: %@ -- value: %@", dict[@"date"], dict[@"value"]);
}

- (NSDate *)monthForGraph
{
	// Graph the current month
    return [NSDate date];
}

- (NSInteger)valueForDay:(NSUInteger)day
{
	// Return 0-5
    return day % 6;
}

Clock Chart

Clock Chart

// This sample uses Storyboard
@property (weak, nonatomic) IBOutlet TEAClockChart *clockChart;

self.clockChart.data = @[
    [TEATimeRange timeRangeWithStart:[NSDate date] end:[NSDate dateWithTimeIntervalSinceNow:3600]],
    // ...
];

Bar Chart

Bar Chart

Just a bar chart, no interaction, no animation.

#import "TEAChart.h"

TEABarChart *barChart = [[TEABarChart alloc] initWithFrame:CGRectMake(20, 20, 100, 40)];
barChart.data = @[@2, @7, @1, @8, @2, @8];
[self.view addSubview:barChart];

Colored Bar Chart

To add colors to the bar chart, add an array of colors

#import "TEAChart.h"

TEABarChart *barChart = [[TEABarChart alloc] initWithFrame:CGRectMake(20, 20, 100, 40)];
barChart.barColors = @[[UIColor orangeColor], [UIColor yellowColor], [UIColor greenColor], [UIColor blueColor]];
barChart.data = @[@2, @7, @1, @8, @2, @8];
[self.view addSubview:barChart];

To add x-labels to the bar chart, set xLabels property. Should be just one character per label since the bars are narrow.

barChart.xLabels = @[@"A", @"B", @"C", @"D", @"E", @"F"];

Installation

Use CocoaPods:

pod 'TEAChart', '~> 1.0'

Or drag TEAChart folder into your project.

Contribution

Pull requests are welcome! If you want to do something big, please open an issue first.

License

MIT

Comments
  • Is it possible to use the contribution chart programmatically?

    Is it possible to use the contribution chart programmatically?

    Hello,

    according to the docs Storyboard is supported so I was assuming programmatic approach should work too, but it is not explicitly stated.

    If using programmatically it is currently not possible to use an own delegate because loadDefaults() will be invoked first thing in the initWithFrame/-Coder. So setting the delegate after that has no effect.

    As a workaround I am currently using plain init and I have exposed loadDefaults in the .h. It would be great if this is supported right away. Or am I missing something?

    Love the charts! Best, Masa

    bug 
    opened by beheim 7
  • Contribution Graph: Using locale for weekdays

    Contribution Graph: Using locale for weekdays

    The order of weekdays seems to be hard coded, where the week always starts on Sunday. Would it be possible to change this in order to support locales where the week starts on Monday? I guess one way to achieve this could be by adding 1 to the index (in case the week starts on Monday) and doing a modulus by 7 afterwards. It would be great if this could be implemented.

    enhancement 
    opened by ankraft 4
  • Added a DataSource protocol for populating the TEAContributionGraph

    Added a DataSource protocol for populating the TEAContributionGraph

    The data array can be populated by the DataSource connected to the TEAContributionGraph. Allows users to change the color scheme for the graph as well as the number of grades. Users can also select which month they want the graph to display which allows more customization.

    Updated the demo view to reflect these changes.

    opened by kylekewley 3
  • show data of selected days in contribution graph

    show data of selected days in contribution graph

    how can we show data of selected days in contribution graph? My code is like:

    - (NSInteger )valueForDay:(NSUInteger)day
    {
        return 4;
    
    }
    

    which show 4 grade data for all the days (1-31) what if i want to show data for only 13th and 14th date? how to do that?

    question 
    opened by deepakverma4 2
  • Accessibility for VoiceOver users

    Accessibility for VoiceOver users

    Issue

    First, thanks for the great library! I'm opening this issue since it's a bit more code than can comfortably fit in a pull request. Currently all 3 charts : Bar, Contribution and Clock are not visible to blind users or anyone using the VoiceOver utility in iOS (Settings > General > Accessibility > VoiceOver).

    Details/Reproduce

    When used in an app, such as the Demo project: Bar and Clock charts are ignored (as can be verified using the Xcode Accessibility Inspector in Developer Tools) and Contribution chart outputs unusable information since it defaults to each block acting as a button.

    Fix/Proposal

    I have fixed this issue by implementing the UIAccessibility methods defined here. Since the branch I modified these on edited the implementation files of all 3 classes and the README, I'm opening this issue to both bring your attention to the feature as well as suggest that I open a pull request that fixes the above.

    Note that the accessibility feature in no way affects regular use of TEAChart in any way. These methods simply allow users who rely on VoiceOver to now use the data contained in the chart.

    opened by mathewa6 2
  • View width is not eqaully splitting

    View width is not eqaully splitting

    screen shot 2017-12-22 at 4 03 01 pm

    This is my code..!

    TEABarChart *barChart = [[TEABarChart alloc] initWithFrame:CGRectMake(0.0, 0.0, barView.frame.size.width, barView.frame.size.height)]; barChart.barColors = @[[UIColor grayColor]]; barChart.data = @[@2, @7, @1, @8, @2, @8, @10, @23]; [barView addSubview:barChart];

    i have given 8 values but showing 7 bars only

    opened by ArunAshokan11 1
  • User interaction with contribution graph

    User interaction with contribution graph

    It would be awesome to have a callback when a user selects a certain date in the contribution graph! A couple ideas: draw the calendar using subviews, or use a collectionview. both would be a major undertaking, though.

    feature 
    opened by kajensen 1
  • Artefacts when the Bar Chart's total width isn't wholly divisible by the number of bars.

    Artefacts when the Bar Chart's total width isn't wholly divisible by the number of bars.

    Nice UIView subclass, exactly what I needed for lots of lightweight bar charts.

    I've spotted an issue with the drawing when the Bar Chart's width divided by number of bars isn't a whole number.

    E.g. a width of 320 and 12 bars produces (colours for illustration purposes :-) ):

    ios simulator screen shot 29 jan 2014 10 56 26

    It looks to me like you could maybe add some minor padding logic by detecting remainders with fmodf.

    bug 
    opened by GregularExpressions 1
  • [For Test Jam] Tests

    [For Test Jam] Tests

    Things I’d like if you’re adding tests for this project:

    Tooling: XCTest

    Notes:

    • In order to write unit tests, we must split the calculation parts out of -drawRect:s (especially in TEAContributionGraph.m) first
    • Maybe write some tests based on image comparison. I don’t know how to do that though.
    opened by xhacker 0
Releases(1.0.0)
  • 1.0.0(Apr 10, 2016)

    Let’s keep the API stable from now on!

    • Added the ability to adjust clock chart border width
    • Clock chart and bar chart are now IB_DESIGNABLE
    Source code(tar.gz)
    Source code(zip)
  • 0.3.2(Sep 14, 2015)

  • 0.3.1(Feb 16, 2015)

  • 0.3(Feb 16, 2015)

    • Able to show day numbers in contribution graph
    • Able to set chart properties right in the Interface Builder
    • Auto-generate cell size for contribution graph. You don’t need to set width and spacing manually anymore. width and spacing have been renamed to cellSize and cellSpacing.
    Source code(tar.gz)
    Source code(zip)
  • 0.2(Dec 22, 2014)

  • 0.1(Jan 31, 2014)

Owner
柳东原 · Dongyuan Liu
水果行业。
柳东原 · Dongyuan Liu
A SwiftUI Contribution Chart (GitHub-like) implementation package

ContributionChart A contribution chart (aka. heatmap, GitHub-like) library for iOS, macOS, and watchOS. 100% written in SwiftUI. It Supports Custom Bl

null 41 Dec 27, 2022
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
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
🐙🐱 GitHub Contribution Widgets for iOS

GitHub Contribution Graphs for iOS Quickly check in on your GitHub contributions from your iOS Home Screen! Select the Widget size that suits you bett

Ander Goig 242 Dec 28, 2022
Simple iOS Application built using UIKit displaying the list of Cryptocurrencies and a detailed screen with a line graph.

CryptoViewer Simple iOS Application built using UIKit displaying the list of Cryptocurrencies and a detailed screen with a line graph. Home Screen: Di

null 0 Jun 14, 2022
An adaptive scrollable graph view for iOS to visualise simple discrete datasets. Written in Swift.

ScrollableGraphView Announcements 9-7-2017 - Version 4: Version 4 was released which adds multiple plots, dynamic reloading of values, more reference

Phillip 5.3k Jan 5, 2023
SwiftyOpenGraph - A swift library that retrieves structured open graph data from webpages.

SwiftyOpenGraph Usage Initialization Base Properties Types Installation License Usage Initialization You use SwiftyOpenGraph by initializing OpenGraph

Quintschaf 1 Jan 6, 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
Infowind - An Open Graph Metadata extension for iOS, iPadOS & MacOS

Infowind ?? InfoWind is an Open Graph Protocol based Safari extension for iOS, i

Gokul Nair 0 Jun 22, 2022
Creates WordCloud type graph from a string or array of strings input.

CPTWordCloud Example To run the example project, clone the repo, and run pod install from the Example directory first. Requirements Installation CPTWo

Chronic Stim 1 Jan 7, 2022
SwiftUI Bar Chart

SwiftUI BarChart Lightweight and easy to use SwiftUI chart library for all Apple platforms Features Scaling on both axes Fully customizable axes (labe

Roman Baitaliuk 158 Jan 6, 2023
Draw a chart with progress bar style

ChartProgressBar-iOS Draw a chart with progress bar style - the android version here Installation iOS version (9.0,*) Swift 3.2 Using cocoapods : pod

Hadi Dbouk 84 Apr 25, 2022
Repository with example app for using Bar chart

Gráfico de Barras (Exemplo) Repositório com app exemplo para o uso do gráfico de Barras. O gráfico de barras é um gráfico com barras retangulares e co

Felipe Leite 0 Nov 5, 2021
SwiftUICharts - A simple line and bar charting library that supports accessibility written using SwiftUI.

SwiftUICharts - A simple line and bar charting library that supports accessibility written using SwiftUI.

Majid Jabrayilov 1.4k Jan 9, 2023
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
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
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
FSLineChart A line chart library for iOS.

FSLineChart A line chart library for iOS. Screenshots Installing FSLineChart Add the contents of the FSLineChart project to your directory or simply a

Arthur 856 Nov 24, 2022