Essential Resources: Programming languages, toolkits and libraries
This is part of a series of posts to share with readers a useful collection of some of the most important, effective and practical data visualisation resources. This post presents the range of data visualisation programming languages, toolkits and libraries, sometimes used in isolation, often used in partnership to accomplish specific functions.
Please note, I may not have personally used all the packages or tools presented but have seen sufficient evidence of their value from other sources. Whilst some inclusions may be contentious from a quality/best-practice perspective, they may still provide some good features and provide value to a certain audience out there. Finally, to avoid re-inventing the wheel, descriptive text may have been reproduced from the native websites if they provide the most articulate descriptions. Your feedback is most welcome to help curate this collection, keep it up to date and preserve its claim to be an essential list of resources!
(Check out a fabulous collection of selected tools, largely covering programming languages and libraries, on Datavisualization.ch)
Vega is a visualization grammar, a declarative format for creating, saving and sharing visualization designs. With Vega you can describe data visualizations in a JSON format, and generate interactive views using either HTML5 Canvas or SVG.
Processing is an open-source programming language, development environment, and online community. Since 2001, Processing has promoted software literacy within the visual arts and visual literacy within technology. Initially created to serve as a software sketchbook and to teach computer programming fundamentals within a visual context, Processing evolved into a development tool for professionals. Today, there are tens of thousands of students, artists, designers, researchers, and hobbyists who use Processing for learning, prototyping, and production.
Processing.js is a ‘port’ of Processing, a sister project as it were, designed to make data visualisations, digital art, interactive animations, educational graphs, video games, etc. work using web standards and without any plug-ins. You write code using the Processing language, include it in a web page, and Processing.js does the rest. Whether you’re an advanced Processing developer or completely new, whether you’re a pro with web technologies or just getting started, Processing.js bridges the gap between these two powerful technologies.
Adobe Flash was once the industry standard for authoring innovative, interactive content used by organisations such as the New York Times and The Guardian. In conjunction with the platform’s programming language, ActionScript, Flash allows designers to bring dynamism to visualisation, opening up infinite possibilities for creativity. Some of the most pioneering, best practice visualisations built in Flash can be found with online news and media sites, introducing interactivity to supplement and enhance the information presentation. The lack of support for Flash across Apple’s suite of devices and the emergence of competing developments, including D3 and HTML5 has somewhat impacted on the current popularity and development of Flash projects, compared to the past.
With Quadrigram you can create custom data visualizations in an intuitive way with the flexibility of a visual programming language. It enables you to prototype and share your ideas rapidly, as well as produce compelling solutions with your data in the forms of interactive visualizations, animations or dashboards. Quadrigram cloud architecture offers the guarantee to process data painlessly. A number of scalable pricing options are available based on the number of users, processing power, storage capacity, traffic and access privileges that you require.
Prefuse is a set of software tools for creating rich interactive data visualizations. It is a Java programming framework for creating rich interactive data visualisations supporting a rich set of features for data modeling, visualisation, and interaction. It provides optimised data structures for tables, graphs, and trees, a host of layout and visual encoding techniques, and support for animation, dynamic queries, integrated search, and database connectivity. Prefuse is written in Java, using the Java 2D graphics library, and is easily integrated into Java Swing applications or web applets. Prefuse development was opened up to the community in 2011.
The Prefuse Flare toolkit is a successor to Prefuse and provides visualisation and animation tools for ActionScript and the Adobe Flash Player. From basic charts and graphs to complex interactive graphics, the toolkit supports data management, visual encoding, animation, and interaction techniques. Moreover, flare features a modular design that lets developers create customized visualization techniques without having to reinvent the wheel. Flare development now opened up to the community on GitHub. Flare 2009.01.24 is last official release .
In response to the mentioned restrictions involving developing projects using Flash, Adobe has responded with its own range of tools for creating next-generation HTML5 projects and designed to “set the benchmark for standards-based web creation”. Of these, Edge Animate is the most interesting offering, designed to “create animated, interactive content for the modern web”, providing an alternative for projects that previously required Flash.
Paper.js is an open source vector graphics scripting framework that runs on top of the HTML5 Canvas. It offers a clean Scene Graph / Document Object Model and a lot of powerful functionality to create and work with vector graphics and bezier curves, all neatly wrapped up in a well designed, consistent and clean programming interface. Paper is the successor or (perhaps better) the alternative to Scriptographer for working with Adobe CS6 onwards.
Arbor is a graph visualization library built with web workers and jQuery. Rather than trying to be an all-encompassing framework, arbor provides an efficient, force-directed layout algorithm plus abstractions for graph organization and screen refresh handling.
Examples/references: Examples of ‘Dataset’
Chart.js offers easy, object oriented client side graphs for designers and developers. You can visualise your data in 6 different ways, with each chart type animated, fully customisable and great-looking, even on retina displays. Chart.js uses the HTML5 canvas element, supports all modern browsers and is dependency free, lightweight with loads of customisation options.
The aim of dimple is to open up the power and flexibility of d3 to analysts. It aims to give a gentle learning curve and minimal code to achieve something productive. It also exposes the d3 objects so you can pick them up and run to create some really cool stuff.
Examples/references: Example projects
Cubism.js is a D3 plugin for visualizing time series. Use Cubism to construct better realtime dashboards, pulling data from Graphite, Cube and other sources. Cubism is available under the Apache License on GitHub.
Cube is an open-source system for visualizing time series data, built on MongoDB, Node and D3. If you send Cube timestamped events (with optional structured data), you can easily build realtime visualizations of aggregate metrics. For example, you might use Cube to monitor traffic to your website, counting requests:
Examples/references: Video demo
Envision.js is a library for creating fast, dynamic and interactive HTML5 visualizations.
Orange offers open source data visualization and analysis for novice and experts. Data mining through visual programming or Python scripting. Components for machine learning. Add-ons for bioinformatics and text mining. Packed with features for data analytics.
The NodeBox family of tools gives you the leverage to create generative design the way you want: a desktop application that lets you create generative, static, animated or interactive visuals. Using open-source tools designers can automate boring production challenges, visualize large sets of data and access the raw power of the computer without thinking in ones and zeroes. Nodebox’s tools integrate with traditional design applications and run on many platforms.
ZingChart is a charting library that renders a wide array of charts and graphs in both Flash and HTML5 Canvas. You can easily change the style, features, and functionality of these charts to create custom data visualisations.
Examples/references: Pinterest Demos Board
TimelineJS is an open-source tool that enables you to build visually-rich interactive timelines and is available in 40 languages. It can pull in media from different sources and has built in support for: Twitter, Flickr, Google Maps, YouTube, Vimeo, Vine, Dailymotion, Wikipedia, SoundCloud and more media types are regularly added.
NetAdvantage provides a range of controls for creating charts with a range of frameworks including asp.net and silverlight. Visualisation options include bar, bubble, Gantt, line, radial, scatter, spline charts, and introducing the doughnut chart, so you can visually represent multiple data series. Animate data over time using the innovative Motion Framework and glean further intelligence from gauges and bullet charts. Plot and interact with geospatial data using rich new features typically reserved for dedicated geospatial developers, thanks to a partnership with the premier supplier of Geographic Information System software.
PivotViewer is a Silverlight control that makes it easier to interact with massive amounts of data on the web in ways that are powerful, informative, and fun. By visualizing thousands of related items at once, users can see trends and patterns that would be hidden when looking at one item at a time.
Gnuplot is a portable command-line driven graphing utility for Linux, OS/2, MS Windows, OSX, VMS, and many other platforms. The source code is copyrighted but freely distributed (i.e., you don’t have to pay for it). It was originally created to allow scientists and students to visualize mathematical functions and data interactively, but has grown to support many non-interactive uses such as web scripting.