25 Libraries for Graphs and Charts

In recent years, there has been an explosion of tools available to designers and developers to generate charts and graphs in web pages and applications. In an arena that was once dominated by Flash or static images, now comes a wide array of visually stunning and dynamic tools that unlock a browser’s full potential using HTML5, SVG, CSS3 and JavaScript.

The correct choice of charting library in a website or app can make the difference between a poor user experience and something that people will share and use over and over.

This Wiki page is a useful reference for a comparison of JavaScript charting frameworks, although it is not all encompassing it does compare supported chart types and rendering technology for a host of popular libraries.

Here’s a list of 25 hand-picked libraries for graphs and charts that should hopefully serve as a useful reference guide.

1. D3

25 Libraries for Graphs and Charts 1
D3.js is a JavaScript library designed to manipulate documents based on data and some of the results are nothing short of spectacular. It utilizes the full potential of HTML5, CSS3 and SVG but in a fast, streamlined manner. Many other charting libraries are now based on D3 technology (such as dc.js).

2. Highcharts

25 Libraries for Graphs and Charts 2
Highcharts is an extensive library of charts and graphs using HTML5/JavaScript that works on just about any device or browser. It’s something we’ve used heavily at Kurtosys for several years, as the extensive range of options caters for most financial data scenarios.

3. Chart.js

25 Libraries for Graphs and Charts 3
Although limited to just 6 chart types, this HTML5-based library renders charts beautifully on screen and is very lightweight and simple to implement.

4. CanvasJS

25 Libraries for Graphs and Charts 4
Another library that uses the HTML5 canvas element – CanvasJS works across all devices, includes interactivity and is easily themeable across 18 chart types.

5. Sigma

25 Libraries for Graphs and Charts 5
Sigma.js is an open-source lightweight JavaScript library for generating data-driven node charts. It allows developers to integrate network exploration in rich Web applications.

6. jQuery Sparklines

25 Libraries for Graphs and Charts 6
A plugin that creates small inline charts (Sparklines) that are generated in the browser.  A range of tiny charts can be customized with mouse-over interaction. This is a great tool for creating stock/fund prices inline with text, or as part of a mini dashboard.

7. Bonsai

25 Libraries for Graphs and Charts 7
A lightweight graphics library with an intuitive graphics API and an SVG renderer. The examples demonstrate not just charts, but simple games, animations and draggable shapes. Cool website too.

8. FusionCharts

25 Libraries for Graphs and Charts 8
This is a comprehensive library that includes 90+ chart types.  They offer not just charts but dashboard widgets, gauges, Gantt charts, heatmaps and a whole series of interactive maps. These are one of the big players in the charting world and claim to have 22,000 clients. Love their Charting Best Practices page.

9. ZingChart

25 Libraries for Graphs and Charts 9
Build interactive charts with options to render in HTML5, SVG, image or Flash.  Some really modern and cleanly designed examples in the gallery – love the mini-dashboard option.

10. xCharts

25 Libraries for Graphs and Charts 10
xCharts is a JavaScript library for building beautiful and custom data-driven chart visualizations using D3.js using HTML, CSS, and SVG. The examples also include some nice animation techniques.

11. amCharts

25 Libraries for Graphs and Charts 11
These guys sell a large array of JavaScript charts, stock charts and maps. There are some cool whizzy animation techniques and all charts seem to be themeable and interactive. The Stock chart is a powerful tool for the right application.

12. Plot.ly

25 Libraries for Graphs and Charts 12
Plotly is all about importing data from a variety of sources (Excel, CSV, Access, GoogleDocs) and creating beautiful charts. You can export to PNG, SVG, PDF, or EPS and all charts are interactive.

13. ShieldUI

25 Libraries for Graphs and Charts 13
Although not exclusively a chart library, this library does offer a range of chart types in its gallery, which includes a useful on-screen code editor. Free for non-commercial use.

14. ZoomCharts

25 Libraries for Graphs and Charts 14
ZoomCharts offer highly interactive HTML5 based charts with impressive results. The network chart is an awesome tool for the right type of data.

15. jChartFX

25 Libraries for Graphs and Charts 15
jChartFX uses pure JavaScript to render a variety of charts. It includes quite a large range of pie, scatter, bar, area, line, bubble and combination charts and is free for personal use.

16. Google Charts

25 Libraries for Graphs and Charts 16
Google offers a good selection of cross-browser compatible charts, including older versions of IE by using VML. Free to use, the gallery demonstrates standard charts, gauges, maps, timelines, histograms, tables and more. This library is also used via an API for other chart engines and plugins such as WordPress Visualizer.

17. Dojo Charts

25 Libraries for Graphs and Charts 17
Dojo charting is a cross-browser 2D vector graphics API that renders charts using SVG. The Business Charts package also comes with a variety of interactive features including touch support for mobile. All of it is completely free and open-source.

18. Flotr 2

25 Libraries for Graphs and Charts 18
Flotr2 is a library for drawing HTML5 charts and graphs. It is a branch of flotr which removes the Prototype dependency and includes many improvements such as mobile support and custom chart types.

19. Zino UI Charts

25 Libraries for Graphs and Charts 19
Zino UI Chart widget is a jQuery Charts plugin, JavaScript chart and graph library for creating interactive charts.

20.  GoJS

25 Libraries for Graphs and Charts 20
GoJS is a feature-rich JavaScript library for implementing interactive diagrams across modern browsers and platforms. It’s pure JavaScript and it does not depend on any JavaScript libraries or frameworks.

21. Kendo UI Charts

25 Libraries for Graphs and Charts 21
Kendo UI is a complete framework for building web and mobile apps in HTML5 and JavaScript. The chart gallery offers all of the usual chart types plus stock charts, gauges, maps and diagrams producing impressive results.

22. Sencha Charts

25 Libraries for Graphs and Charts 22
The Sencha framework offers Rich, interactive charts built in HTML5 for touch devices. It includes support for native gestures on mobiles and tablets such as pinch-to-zoom and swipe-to-pan, which brings charts to life and massively improves UX.

23. EJSCharts

25 Libraries for Graphs and Charts 23
EJSCharts offer 100% JavaScript charting with a range of chart types. Includes features such as hints, mouse tracking, mouse events, key tracking, and events, zooming, scrolling, and crosshairs which improve interactivity and UX.

24. Grafico

25 Libraries for Graphs and Charts 24
Grafico is a JavaScript charting library based on Raphaël and Prototype.js. It produces simple, clean charts inspired by work of Stephen Few and Edward Tufte.

25. dhtmlxCharts

25 Libraries for Graphs and Charts 25
dhtmlxChart is a JavaScript charting library for generating cross-browser HTML5 charts. Check the demos where you can edit the data on-screen to dynamically update the charts.

To see how the top money  managers use dynamic charts, see our post on the top 20 ranked fund websites. And feel free to drop us a comment to suggest any cool libraries for graphs and charts that we have missed in this list.

Facebook
Twitter
LinkedIn

Insights from our blog

Kurtosys Client Reporting 3.0

Client Reporting 3.0

The term “Client Reporting” is a fundamental part of the asset management

Real growth. Realized.

Reduce time to market for websites, marketing documents and content portals by over 50%, and at one third of the traditional cost.

Times are changing. Stay informed

Get in touch

Drop us a line and a member of our team will be in touch with you shortly. Alternatively, use the chat feature at the bottom of the page.