15 JS Charting Libraries That Won’t Ruin Your UX Designs

The line between designer and developer is thinner than ever. And for good reason! We all know the soul-crushing feeling of dreaming up a gorgeous web or mobile design, only to have the magic stripped away because of some technical requirement or challenge. When it comes to displaying data and dashboards, functionality and design go hand-in-hand. Users expect both deep insights and a slick experience. There is certainly no shortage of Web, iOS  and Android charting libraries available for open use, but how many will play nice your designs? Below are 15 JS charting libraries that will help you keep your app functional and sexy at the same time.

AM Charts

Not only does AM Charts let you fully customise the design of your charts – they really want you to! A live editor lets you play in-browser for accurate mockups, and their Inspiration Gallery demonstrates just how tailored these charts can be.

Screen Shot 2015-10-06 at 14.56.19

Single site license $140 with team & SaaS licenses available. http://www.amcharts.com/javascript-charts

Shinobi Controls

Includes a nice gallery of real-life examples.

Screen Shot 2015-10-06 at 15.26.50

https://www.shinobicontrols.com/shinobicharts

MPAndroid + iOS Port

Originally only for Android, there is now an iOS port for the popular MPAndroid Chart library. Their short, straight-to-the-point demo video shows some examples. Some wise advice from the GitHub download page: “Remember: It’s all about the looks.”

Screen Shot 2015-10-06 at 15.30.13

MPAndroid Chart: https://github.com/PhilJay/MPAndroidChart iOS Port: https://github.com/danielgindi/ios-charts

FusionCharts

Offering a massive gallery of over 800 jFiddle-hosted live examples to demonstrate their easy customisation options.

Screen Shot 2015-10-06 at 14.02.39

$199 for individual developers or freelancers. Enterprise options available. http://www.fusioncharts.com

JS Charts

Screen Shot 2015-10-06 at 14.58.23

Free for personal use. $100 for commercial, with team & enterprise licenses available. http://www.ejschart.com/index.php

Charts.js

Screen Shot 2015-10-06 at 15.01.55

Free, open source and available under the MIT license. http://www.chartjs.org

Chartist.js

Perfect if you’re looking for something with a sleek, flat look by default.

Screen Shot 2015-10-06 at 15.04.17

Free, open source. http://gionkunz.github.io/chartist-js/index.html

Morris.js

Their tagline is “good-looking charts shouldn’t be difficult” and we couldn’t agree more.

Screen Shot 2015-10-06 at 15.06.16

Free, open source. http://morrisjs.github.io/morris.js/

Google Charts

A staple for developers for ages. Live playground testing gives you the ability to mock up examples directly in your browser.

Screen Shot 2015-10-06 at 14.53.11
Screen Shot 2015-10-06 at 14.52.17

$90 for single website/developer. 5-10 developer licenses available. http://www.highcharts.com

C3.js

Bare-bones out of the box makes for easy editing.

Screen Shot 2015-10-06 at 15.03.54

Free, open source and available under the MIT license. http://c3js.org

JSCharts

Screen Shot 2015-10-06 at 14.53.50

Watermarked version is free. Single commercial domain $79. http://www.jscharts.com

ZingChart

Screen Shot 2015-10-06 at 14.54.26

Branded version is free. Single site license £249 with enterprise SaaS & licenses available. http://www.zingchart.com

Plottable

Screen Shot 2015-10-06 at 15.02.33

Free, open source. http://plottablejs.org

NVD3

Screen Shot 2015-10-06 at 15.07.01

Free, open source. http://nvd3.org/index.html

Did I miss one? Send me a message on Facebook or Twitter!