D3 Data Visualization Gallery

Coding, Data Analysis & Visualization

Free
No Download/Install required
No registration

One of the must-have tool to represent any dataset in a graphical or interactive manner.

This superb classified gallery of examples of many graphs, charts and diagrams demonstrates what can be made with the free D3 javascript framework.

Tip: click on the small top “D3” title to see even more examples, more than 500, but unclassified.

Usage experience: we use the D3 library on this website extensively. This is without any doubt one of the best library to convert data into nice and clear visualisation. One aspect to have in mind tough: it has been expanded and expended over the 10 last years for more possibilities, features browser compatibility, javascript compatibility and performance, but for graphs types existing since the beginning (ex.: tree), you will find online many examples done with the D3 v3 … that are not compatible with breaking changes introduced in v5, v7, but particularly in v6. So chose your starting point and online exemples wisely.

Disciplines: Data science, Journalism, Data analysis, Web development, Statistics, Scientific research.

Free alternative to Tableau, Power BI, Highcharts.

D3 Data Visualization Gallery compared with Tableau, Power BI and Highcharts
D3 Data Visualization Gallery	Tableau	Power BI	Highcharts
Nature of the product: The gallery is published by the D3 account on Observable and shows examples of D3, which its GitHub page calls a free, open-source JavaScript library for visualizing data.	Nature of the product: Tableau is a commercial product family with Desktop, Cloud and Server deployment options, plus a free Tableau Public offer listed under its community section.	Nature of the product: Power BI Desktop is a Microsoft application for building interactive reports. It is described as a drag-and-drop canvas with a Power Query data preparation experience and data modelling tools.	Nature of the product: Highcharts Core is a JavaScript charting library. Like D3 it is used from code, but it is a packaged chart library installed with npm install highcharts.
Rendering technology: D3 is described as bringing data to life with SVG, Canvas and HTML, so the developer chooses how each mark is drawn.			Rendering technology: Highcharts Core is based on SVG. A WebGL-powered boost module is available for very large datasets.
Licence and cost: D3 is released under the ISC licence and is free to use.	Licence and cost: Pricing is not shown on the product trial page, which points to a pricing calculator and a sales contact. Tableau Public is offered for free, and students and teachers can get Tableau free through Academic Programs.	Licence and cost: Power BI Desktop is listed as free. Power BI Pro is a paid per-seat subscription, billed yearly.	Licence and cost: Commercial projects need the appropriate licence in place, with pricing on the Highcharts shop. An Educational License is listed, and downloading the source for inspection does not require a trial licence.
Data connection and modelling: D3 itself binds data to the page in the browser. Data loading, cleaning and any statistics are written by the developer.		Data connection and modelling: Power BI connects to hundreds of on-premises and cloud sources such as Excel, SharePoint, Salesforce and Azure SQL Database. DAX, a formula language, is available for advanced models.	Data connection and modelling: Highcharts renders the data it is given. The vendor lists integrations for React, Angular, Vue, Node.js, Python and Svelte, and wrappers for .NET, PHP, R, Java, iOS and Android.
Extending and embedding: Because D3 is a library, the output can sit in any web page, which is the way the visualisations on this site are produced. Examples written for older D3 versions may break on current versions.		Extending and embedding: Reports can be published to the cloud or on-premises and embedded in apps or websites. Custom visuals can be built with an open-source framework.	Extending and embedding: The library is embedded in web applications through the official integrations listed by the vendor.

Topics covered: Data Visualization, D3js, Graphs, Charts, Diagrams, Interactive, JavaScript, Framework, Browser Compatibility, Performance, Examples, Library, Features, Tree Graphs, Breaking Changes, Version Compatibility, Visualization Standards, ISO 9241, ISO 25010, ISO 10013, ISO 25012, and ISO 25051..