GraphView

KO | EN

gitlite — search

#ai #typescript #golang #rust #deep-learning #docker #macos #nodejs #awesome #kubernetes #vue #security #openai #open-source

(★ 106)

A simple, elegant graph view for iOS and macOS.

GraphView Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Graph View

## Description
GraphView is a very simple graph library for both iOS and OS X that lets you very easily plot a graph from real-time data. We use it internally at MOON Wearables to plot real-time data from different sensors. Below you can see a screenshot and some GIFs of the graph view plotting sample data generated by compound sine waves. There's example code for both OS X and iOS in their respective folders.

![Image](http://imgur.com/P8pfcP8.png)

![Image](http://imgur.com/aBwsPs5.gif)

## API
### Overview
The entire library is just one class called `GraphView`. It has a range of properties that can be used to customize the graph, and a few methods to add and remove data. The graph automatically scales based on the values you've passed into it. Although you can force it to not scale by setting `isAutoscaling = false` and `visibleRange = 3...5`, or whatever range you want. On iOS, you can also pinch and pan on the graph to move around. If you don't want this behavior (like if you're using it in a table view) you can set `gesturesEnabled = false`.

### Properties

##### var backgroundTint = BackgroundTintColor.blue
This will set the background gradient of the graph. It's an enum with eight colors to pick from: `.gray`, `.red`, `.green`, `.blue`, `.turquoise`, `.yellow`, `.purple`, and `.clear`. The default is `.blue`.

##### var sampleColor = SampleColor.color(plain: .white)
The color of the samples plotted in the graph. This can either be a `.plain` color, or a `.gradient` one. The default value is plain white.

##### var roundedCorners = false
Use this to make the corners rounded or square. The default is true, meaning rounded corners.

##### var title: String = ""
Used to set the title of the graph in one of the upper corners. The default value for this is `""`, meaning that it will not be displayed.

##### var subtitle: String = ""
Used to set a subtitle that will go right underneath the title. The default value for this is `""`, and will thus not be displayed.

##### var valueUnit: String = ""
The unit of the samples added to the graph. This appears as a suffix for the value labels on the right hand side.

##### var valueUnitDecimals = 0
The number of desired decimals displayed for the values. The default is 0.

##### var capacity = 1000
The number of samples that fit in the graph view. When more samples than this are added, the oldest samples will slide off the left edge. This value can't be lower than 2. The default value is 1000.

##### var graphType = GraphType.scatter
How the graph should be plotted. You can choose between `.line` and `.scatter`. The `.line` option currently only works when using the replace(with: ...) method to set the data.

##### var sampleSize = SampleSize.small
The size of the samples. This is only applicable when `graphType` is set to `.scatter`.

##### var gesturesEnabled = true
This property is only available on iOS. It specifies if the user should be able to change the capacity (by pinching horizontally), the minimum and maximum value (by pinching vertically), and moving up and down the y-axis (by swiping). When the user has started interacting, an "Auto-Scale" button will appear. This button is removed again when the user taps it.

##### var visibleRange: ClosedRange<Float> = 0...1
Gets or sets the range of values that can be visible within the graph view. If `isAutoscaling` is set to true, this will change by itself. If you want to set this variable yourself, you should probably set `isAutoscaling` to false.

##### var isAutoscaling = true
Whether or not the graph should be autoscaling. This will be false if the user is currently using gestures

##### var horizontalLines: [Float] = []
Horizontal lines will be drawn with the y-axis values corresponding to the values in this array.

### Methods
##### func add(sample: Float)
This method is where you add your data to the graph. When the number of samples in the graph exceeds `capacity`, the values will disappear off to the left. If you want to set the `graphType` to `.line`, you have to call `replace(with: ...)` instead of this to make the graph look correct.

##### func replace(with: [Float])
This replaces all the samples in the graph at the same time. It also sets the `capacity` to the correct value. This is a lot faster than looping through your data and continuously calling `add(sample: ...)` if you want to show a whole dataset at once. If you want to set the `graphType` to `.line`, you have to call this method instead of `add(sample: ...)` to make the graph look correct.

##### func clear()
Removes all the samples you've added to the graph. All the other properties like `roundedCorners` and `capacity` etc are kept the same. Useful if you want to reuse the same graph view.

## Todo
- Change the size of the labels when the view gets too small.
- I'm pretty sure there's a different way of doing this that will make it faster. Will probably end up drawing into a bunch of tall, skinny CALayers, and then moving them sideways.
- <del>Have an auto-scale feature. Might do this by having an Optional scale tuple with a min and max value. If this is nil, use auto-scale. If it's set use a fixed scale.</del>
- <del>Add IBDesignable</del>
- <del>Add scatter plot</del>

## Contact
- [@vegather on Twitter](http://www.twitter.com/vegather)

GraphView

GraphView Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

GraphView

GraphView Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README