Start-up Xcode and create a new project via File / New / Single View Application – selecting the option to use Automatic Reference Counting.


Within your newly created project add a reference to the ShinobiCharts framework. If you’ve installed ShinobiCharts using our installer, you can add this in the same way as you would any of the standard Apple frameworks. Select your project target, and switch to the Build Phases tab. Open the Link Binary With Libraries section, click the Plus button, find the entry for ShinobiCharts.framework, and click Add.

If you have just copied the framework onto your machine, the easiest way to add it to your project is to locate the ShinobiCharts.framework and drag it directly into your project.

ShinobiCharts makes use of a few other frameworks, so add the following as well:

  • Security.framework (Trial Version only)
  • QuartzCore.framework
  • OpenGLES.framework
  • CoreText.framework
  • libc++.dylib

The first step is to create an instance of the chart and add it to the view. Open up the ViewController.m file and add the following import statement

#import <ShinobiCharts/ShinobiChart.h> 

Further down the same file add an instance variable for the chart:

@implementation ViewController
    ShinobiChart* _chart;

Within the same file add the following to the viewDidLoad method:

self.view.backgroundColor = [UIColor whiteColor];
CGFloat margin = (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone) ? 10.0 : 50.0;
_chart = [[ShinobiChart alloc] initWithFrame:CGRectInset(self.view.bounds, margin, margin)];
_chart.title = @"Trigonometric Functions";

_chart.licenseKey = @""; // TODO: add your trial licence key here!

This instantiates the chart object, and sets its title. Note that the margin around that chart depends on the device form factor. For the iPad a larger margin is used.

If you have downloaded a trial version of the ShinobiCharts you will have been issued with a trial license key. Add the key that you were supplied with at the location indicated above.

The ShinobiChart object is a UIView subclass, so honors resizing masks and auto-layout. Further down the same method add the following:

chart.autoresizingMask =  ~UIViewAutoresizingNone;

This ensures that the chart frame is adjusted when the device orientation changes.

The next step is to add the axes to the chart. In this example both the X and Y axes are linear, although the chart also supports date-time and category axes. Further down the same method add the following:

// add a pair of axes
SChartNumberAxis *xAxis = [[SChartNumberAxis alloc] init];
_chart.xAxis = xAxis;

SChartNumberAxis *yAxis = [[SChartNumberAxis alloc] init];
_chart.yAxis = yAxis;

Now that the chart is configured, the final step is to add it to the view. Add the following to the end of the method:

// Add the chart to the view controller
[self.view addSubview:_chart];

Before you can see the chart in action, you need to supply some data, which brings us onto the next step …