D3.js
D3.js is an open-source JavaScript library for binding data to documents and creating dynamic, interactive visualizations in web browsers.
D3.js in Action, Third Edition
D3.js is a JavaScript library for binding data to documents and creating interactive, customizable visualizations in web browsers.
- How it is used
- Builds custom, interactive web visualizations when predefined charts or point-and-click tools are too limiting.
- How deep it goes
- Explains implementation from loading data through DOM binding, scales, axes, and mouse interactions, while deferring data cleaning.
- Examples
- Builds a survey-based bar chart and a frontend-framework dashboard with scatterplots and bar charts.
- What you can do after
- Build it from scratch by loading data, binding it to visual elements, scaling values, and adding interactive behavior.
Build Financial Software with Generative AI (From Scratch)
D3.js is a JavaScript library for binding data to documents and creating dynamic, interactive data visualizations.
- How it is used
- Builds a simple web UI that visualizes local API results as lists or bar charts.
- How deep it goes
- Walks through chart refinements and API-list rendering, but defers broader visualization design and advanced D3.js internals.
- Examples
- Uses a five-value bar chart, axis labels, hover highlighting, and a health-status API list.
- What you can do after
- Apply it via D3.js to fetch JSON and render returned records in an HTML page.
Read how Build Financial Software with Generative AI (From Scratch) explains D3.js →
Everyday Data Visualization
D3.js is a free, open-source JavaScript library for producing dynamic, data-driven documents and visualizations in web browsers.
- How it is used
- Produces dynamic, data-driven visualizations in web browsers through JavaScript and web standards.
- How deep it goes
- Demonstrates a basic bar chart and core technologies, but defers coding instruction and detailed implementation.
- Examples
- Uses fruit data, a basic bar chart, and web visualizations such as those published by The New York Times.
- What you can do after
- Build a basic browser bar chart with D3.js using approximately 50 lines of code.
Related concepts
- SVGuses · SVG, or Scalable Vector Graphics, is an XML-based standard and file format for describing scalable, resolution-independent two-dimensional vector graphics.
- JavaScriptuses · JavaScript is a high-level, dynamically typed, multi-paradigm programming language standardized as ECMAScript and used for web and general-purpose programming.
- selection.attr()uses · A D3 selection method that gets or sets attributes on elements in a selection, optionally deriving values from bound data.
- CSSuses · CSS, or Cascading Style Sheets, is a stylesheet language for specifying the presentation and layout of structured documents and user interfaces.
- HTMLuses · HTML (HyperText Markup Language) is the standard markup language for structuring content and elements in web documents.
- DOM manipulationuses · DOM manipulation is the programmatic inspection or modification of nodes, attributes, content, styles, or structure in a document object model.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.