Chartkick is a Ruby gem (also has a JavaScript API which doesn’t require Ruby) for creating good-looking charts very easily and quickly.
It integrates with 2 charting libraries: Highcharts and Google Charts where it is possible to use the same functions for generating charts with each library.
There is support for multiple chart types and multiple series in a single chart.
And, like mentioned there is also Chartkick.js which brings the same functionality to the client-side, without Ruby.
Requirements: Rails 3.1+ (for the Ruby version)
RazorFlow is a PHP framework for easily creating dashboards that work well on all major devices and browsers.
Info: The framework is currently in beta period, it is free for personal use and will require a license for commercial use.
It works by simply inserting a single PHP file into any app, feeding it with data and choosing the output type.
The outputs can be charts (many chart types are supported), data grids or items that display a single value.
They are all interactive, have support for filtering the data and, like mentioned, they are responsive.
RazorFlow can connect to MySQL, PostgreSQL, or SQLite databases.
Requirements: PHP 5.3+
Chart.js is an impressive JavaScript charting library that is built on top of HTML5 canvas.
It currently supports 6 chart types (line, bar, radar, pie, column and polar area) and all this comes in a standalone, <5kb package.
Colors, fonts, borders and their sizes can all be customized. Also, optionally, charts can be loaded with an animation.
As the library is built with canvas, it works on a wide set of browsers, loads fast but lacks interactivity.
Requirements: No Requirements
Compatibility: All Modern Browsers
Gantt charts are an important piece of project management apps or any process with a duration.
Teamwork Gantt is a free jQuery component, created by Teamwork (a project management service), that simplifies generating Gantt charts.
It has a wide array of features including zooming, drag ‘n’ drops, in-place-editing, resize, scroll and many more.
There is support for exporting the data in JSON and the layout is skinnable with CSS.
Requirements: jQuery
Flot is a jQuery plugin for easily creating good-looking and interactive charts.
The library uses HTML5 canvas for drawing, JSON as the data source and can render a data array with 1000s of items.
It is not limited to any chart type and the community has already expanded it with multiple types (bar, line, pie, gantt, etc.) and features.
There is support for zooming into any selected part and charts generated can respond to events.
Flot is very well-documented, has a powerful API and an active community
P.S. The library has been around since 2 years but somehow it was not already shared and thought it should be in WRD so that you get another great charting option when needed.
Requirements: jQuery
Compatibility: All Major Browsers
xCharts is an open JavaScript charting library that is built on top of D3.
It works with using HTML-CSS + SVG to create good-looking and custom-data-driven charts with ease.
There is support for 4 chart types: bar, cumulative, line and line-dotted where the colors, text,dimensions can all be defined via CSS.
The data is provided as JSON and there are callbacks for events like mouseover, mouseout, click so that any interactions can be added.
Requirements: D3
Compatibility: All Major Browsers
Sparklines, the tiny charts that can be used near a sentence, headline, graphic.., are very handy for visualizing data inside the content.
Sparky is a free JavaScript sparklines library that depends on Raphaël and very easy to use.
It has support for multiple chart types (line, bar and area) where line + area charts can have multiple colors as well.
The usage is very straightforward; just create an HTML element (preferably <span> for inline use) and provide the values as an array with a data attribute. And, define the settings (width, height, colors, padding, etc.) with a JS function.
Requirements: Raphaël
Compatibility: All Major Browsers
Jim Knopf is a JavaScript library for creating SVG-powered knobs.
The library doesn’t require any JS frameworks and it comes with various built-in knob types.
Knobs created can be scaled completely (thanks to SVG) and their designs can be customized with CSS.
Also, they can be controlled with mouse, mousewheel, keyboard or touchpad and options exist for setting the min/max values, starting points and the angles allowed.
Requirements: No Requirements
Compatibility: All Major Browsers
D3-Cloud is a beautiful and open sourced implementation of word clouds that are familiar from Wordle.com.
It is built with the D3.js library, uses HTML5 canvas for drawing the output and works asynchronously for a good performance.
The size of the cloud, font used, font-size, padding and more stuff can be customized.
Also, a web-based word generator with SVG + PNG downloads is provided.
Requirements: D3.js
Compatibility: All Modern Browsers
Bonsai is an open source JavaScript library for creating graphics and animations.
The library renders the outputs using SVG and comes with an intuitive, feature-rich API.
There is support for creating simple shapes (rectangle, circle, ellipse, etc.) with specific functions and a path() function exists for drawing any custom shapes.
It is possible to apply colors, gradients and filters (grayscale, blur, opacity and more) to these shapes.
Many mouse (or touch) and keyboard events are already built-in to the library and they can be managed easily.
Bonsai has support for standard animations and also keyframe animations for setting up a series of consecutive animations.
And, lots of easing functions exist for using them inside the animations.
Requirements: No Requirements
Compatibility: All Major Browsers
