Bake your own Mobile Research App. No coding. No upfront cost.
Register NowIn this article I am going to be covering the charts packaged with the ResearchKit library using Swift.
Out of the box ResearchKit provides pie charts (ORKPieChartView), line graphs (ORKLineGraphView) and discrete graphs (ORKDiscreteGraphView).
The source code and demo is available in the ResearchKit library. – https://github.com/ResearchKit/ResearchKit/tree/master/samples/ORKCatalog
Providing Data with dataSource
let pieChartView = ORKPieChartView() pieChartView.dataSource = DemoPieGraphDataSource()
All charts get their data using the dataSource property. Each chart has a specific dataSource that must be implemented. The line and discrete graphs use the (ORKGraphChartViewDataSource) and the pie chart uses the (ORKPieChartViewDataSource).
ORKPieChartViewDataSource
class DemoPieGraphDataSource: NSObject, ORKPieChartViewDataSource { let data = [30, 14,52, 45, 66] func numberOfSegmentsInPieChartView(pieChartView: ORKPieChartView) -> Int { return self.data.count } func pieChartView(pieChartView: ORKPieChartView, valueForSegmentAtIndex index: Int) -> CGFloat { return self.data[index] } func pieChartView(pieChartView: ORKPieChartView, titleForSegmentAtIndex index: Int) -> String { return "\(index)" } }
ORKGraphChartViewDataSource
class LineGraphDataSource: NSObject, ORKGraphChartViewDataSource { let data = [ ORKRangedPoint(value: 1.5), ORKRangedPoint(value: 21.5), ORKRangedPoint(value: 51.5), ORKRangedPoint(value: 71.5), ORKRangedPoint(value: 61.5), ORKRangedPoint(value: 91.5), ORKRangedPoint(value: 171.5), ORKRangedPoint(value: 161.5), ORKRangedPoint(value: 291.5), ORKRangedPoint(value: 471.5), ORKRangedPoint(value: 361.5), ORKRangedPoint(value: 591.5), ] func numberOfPlotsIngraphChartView(graphChartView: ORKGraphChartView) -> Int { return 1 } func graphChartView(graphChartView: ORKGraphChartView, pointForPointIndex pointIndex: Int, plotIndex: Int) -> ORKRangedPoint { return data[pointIndex] } func graphChartView(graphChartView: ORKGraphChartView, numberOfPointsForPlotIndex plotIndex: Int) -> Int { return data.count } func graphChartView(graphChartView: ORKGraphChartView, titleForXAxisAtIndex pointIndex: Int) -> String { return "\(pointIndex + 1)" } }
ORKPieChartView Customizations
The pie chart can have titles, colors and size customizations added.
Customize the color and labels in the pie chart using the ORKPieChartViewDataSource methods below.
class DemoPieGraphDataSource: NSObject, ORKPieChartViewDataSource { let colors = [ UIColor(red: 26/225, green: 145/255, blue: 217/225, alpha: 1), UIColor(red: 142/255, green: 26/255, blue: 217/255, alpha: 1), UIColor(red: 244/255, green: 190/255, blue: 217/255, alpha: 1) ] func pieChartView(pieChartView: ORKPieChartView, colorForSegmentAtIndex index: Int) -> UIColor { return colors[index] } func pieChartView(pieChartView: ORKPieChartView, titleForSegmentAtIndex index: Int) -> String { return "Day \(index + 1)" } }
Customize the size, titles and animation using the ORKPieChartView object.
pieChartView = ORKPieChartView() pieChartView.title = "Steps" pieChartView.text = "Per Day" pieChartView.lineWidth = 21 pieChartView.animateWithDuration(0.75)
ORKLineGraphChartView & ORKDiscreteGraphChartView
The ORKLineGraphChartView and ORKDiscreteGraphChartView both extend from the ORKGraphChartView and provide customizations through its view.
lineGraphCartView = ORKLineGraphChartView() lineGraphChartView.tintColor = UIColor(red: 65/255, green: 30/255, blue: 15/255, alpha: 1) lineGraphChartView.showsHorizontalReferenceLines = false lineGraphChartView.showsVerticalReferenceLines = false // Same customization for the ORKDiscreteGraphChartView discreteGraphCartView = ORKDiscreteGraphChartView() discreteGraphChartView.tintColor = UIColor(red: 65/255, green: 30/255, blue: 15/255, alpha: 1) discreteGraphChartView.showsHorizontalReferenceLines = false discreteGraphChartView.showsVerticalReferenceLines = false
ORKChartGraphView also allows for graph gesture delegation using (ORKGraphChartViewDelegate), axis and scrubber customization and supports adding images to X,Y min values in the graph.
Summary
The charts available are limited but the graphs look nice, work well from the demo and the library is actually built as a standalone package.
If you need a simple graph for your ResearchKit project these are a good option.