What's your favorite charting library?

Hey Ionites,

The Ionic team is thinking of supporting a charting library officially, and would love to hear about your experiences using some of the most popular libraries out there.

Some of the front runners are Highcharts and c3/d3. Any others we’re missing?

What kind of features would you like to see in a charting library?



Raphaël and morris.js :smiley:

1 Like

First of all, I want to say that I’m not a charts expert, I’m just a beginner of data visualization, but for a project that I’m working on I’ve tried 2/3 solutions. The first one was google charts (really easy to use, but not customizable enough), then I’ve tried to use d3, but the first approach didn’t went well, then I’ve tried Highcharts and I fell in love with it. It’s reall simple to use and the level of customization is very high.

My votes with highcharts

ChartJS Library from http://www.chartjs.org/


Highcharts is definitely awesome, the only issue is the license. I’m not sure we can support it in a meaningful way with the current commercial license.

Does anyone have experience with c3js? http://c3js.org/


Yes. We are using that. Awesome.backed by d3

1 Like

I use highcharts lib

I honestly don’t care much about the specific library you choose. I care about the API designed for it and how easy it is to style.

I’ve written a lot of charts for projects, and typically have used Highcharts due to uniformity with other company assets. The Highcharts license is a major problem though, its not free for commercial use.

I care that a chart component would allow only primarily simple charts. On mobile, you don’t usually want/need a crazy amount of data on the chart. If you do, then don’t use the built in chart component.

Here is a sample interface that might give you some insight into how I would like to use a chart component. I would prefer to keep as much of the configuration to handle the chart in the directive, and out of Javascript.

<ion-chart title="ION Stock Price" x-axis-label="Date" y-axis-label="Price and Volume">
  <ion-chart-series data="series1" type="line"></ion-chart-series>
  <ion-chart-series data="series2" type="bar"></ion-chart-series>
$scope.series1 = [...];
$scope.series2 = [...];

D3 or C3 rock. You should definitely consider those. Definitely easy to use directives and awesome touch event support.

C3 has been pretty awesome from past experience.

Libraries like angluar-charts (https://github.com/chinmaymk/angular-charts/) aren’t bad, but they have their limits.

Highcharts is out of the question, most of the products built with Ionic are Commercial isn’t?

We are using C3/D3 at https://mateprofiler.com/ and it works just fine, though the features are not as fancy as highcharts’.

1 Like

I’ve used http://nvd3.org/ it’s pretty neat for simple stuff.
One of my homies made a C3 directive, might be a good starting point https://github.com/maseh87/c3-chart

1 Like

Highcharts rocks!! http://www.highcharts.com/ :smiley:

I also like d3 or nvd3, as Mehul proposed. It seems preety capable. Google charts are nice and easy to use but I was missing touch support, as with most chart libraries (particularly with zooming).

http://gionkunz.github.io/chartist-js looks interesting.

Also, D3 is heavy in all use cases.

PS. when doing networks, use http://sigmajs.org/

http://www.chartjs.org looks best

Highcharts! is awesome and developer friendly :slight_smile:

C3 charting library based on D3 is the best :wink:


I’ve used Highcharts in a recent desktop project and I’ll admit its a great library. It gets my vote.
I’m working on a new app, a medical one, so would like to use charts in it. So I keen to see which one you go for.


This is pretty interesting, it’s clean but limited functionality http://tinychart.co/