Skip to main content
SimilarExport ZIP
100%

Bret Victor’s Reading List

✓ Published0🌍 Public
JJastor11
Last edited Apr 13, 2014
Created on Dec 10, 2025

This visualization presents Bret Victor’s curated reading list as a hierarchical tree, categorizing recommendations into Design, Engineering, and Society. The data is parsed from the plain-text Markdown file, with starred items (including the rare six-star entries) highlighted through visual emphasis. The layout uses a radial tree structure, rendered with SVG paths and circles. The code employs the `d3.forceSimulation` API to position nodes and `d3.hierarchy` for tree layout, with labels shown in a readable font.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 466252

This example is a data-art composition built from a personal list of recommended web design and programming books, rendered as an interactive force-directed graph. It visualizes the relationships between books, their authors, and their associated topics (like usability, web standards, JavaScript, Ruby, and Rails) using `d3.forceSimulation` for physics-based layout and dynamic node positioning. Each book title, URL, and annotation from the original text is embedded as textual nodes and links, with the graph’s structure and labels derived directly from the source gist’s content. The rendering approach uses SVG elements updated via D3’s data join, and while no explicit additional libraries are mentioned, the code relies on standard D3 v4+ APIs for simulation, drag behavior, and tick updates to show the clustered, interlinked reading list.

DDylanFM
69% match
Loading thumbnail…

Gist fd96cadbc2332c8aea3d

This visualization presents a hierarchical outline of Robert C. Martin’s “Craftsmanship and Ethics” principles, rendering each concept as a labeled node in a radial tree layout. The structure uses `d3.forceSimulation` with collision detection to position the nodes, while links connect parent concepts to their sub-principles. Text labels are placed directly on the nodes, and the layout emphasizes the progression from broad disciplines like “Discipline” down to specific practices such as “TDD” and “100% Code Coverage.” The data comes from the markdown source text, parsed into a nested JSON hierarchy.

CCliffordAnderson
68% match
Loading thumbnail…

Alex Ziskind long prompt July 2025.

This example presents a data-visualization of a massive, structured technical guide as a hierarchical, interactive diagram. It uses D3.js’s `d3.hierarchy` and `d3.tree` layout to render the document’s headings as a collapsible node graph, with each node connected by `d3.linkHorizontal` paths. The visualization displays the markdown content’s section titles and subsections, using `d3.zoom` for panning and scaling, and `d3.treemap` for the final layout. The underlying data is the raw Markdown text file, parsed and formatted to show the guide’s structural outline rather than its full textual content.

IIoTeacher
62% match
Loading thumbnail…

Force-Directed Tree

The visualization shows a small, hierarchical set of d3 software components arranged as a force-directed tree. Nodes and links are rendered as SVG circles and lines using D3’s force layout, with a weak vertical push that separates parent nodes from their children to suggest a tree structure. The example uses `d3.layout.force` with charge and link distance parameters, and updates node positions on each tick with `force.on("tick", tick)`. Node colors come from a categorical scale, and the data is loaded from an external JSON file containing nodes and links.

Mmbostock
61% match
Loading thumbnail…

Brett's Type Refinery D3v4 and Webcola Controls

Brett's Type Refinery D3v4 and WebCola controls is an interactive graph and tree visualization using D3.js v4. It displays a collapsible hierarchical tree of STIX 2.1 threat intelligence objects, with webcola force-directed layouts for promoted and attached relationships. Users switch between tree indices via radio buttons, and d3.drag() enables node repositioning while d3.zoom() supports canvas panning. The interface includes right-click context menus and animated transitions for tree updates.

Bbrett@cloudaccelerator.co
61% match
Loading thumbnail…

Digital Science for Library Workship

This example visualizes a list of Digital Science tools, sourced from a gist by Clifford Anderson, as a static text-based layout. It reads the topics from a Markdown file and renders each entry as a clickable hyperlink to its official website. The code uses the D3.js library, specifically `d3.select` and text element creation, to position the items within an SVG canvas. The visualization does not encode data into shapes or colors; instead, it presents the information as a clean, typographic interface for workshop attendees.

CCliffordAnderson
61% match
Loading thumbnail…

Radial Tree

This radial tree displays hierarchical data as a branching network of nodes and links radiating from a central root. The visualization uses D3 v7’s `d3.hierarchy`, `d3.tree`, and `d3.linkRadial` to compute the layout and draw curved edges, with nodes rendered as SVG circles and labels. Interactive links are added via `xlink:href` attributes. The data comes from a `data.json` file containing tasks, health goals, and awards, arranged in a nested children structure. The SVG output is styled with sans-serif fonts and customizable colors, strokes, and node radii.

WWRCIECH
60% match
Loading thumbnail…

Sitio que sigo por RSS

This visualization displays a personal list of RSS feeds, showing each blog as a floating node connected to a central hub. It uses d3.forceSimulation to position the nodes and SVG elements to render them, with the site names and URLs parsed from the markdown file. The layout reveals the author’s curated collection of JavaScript and web development resources, including notes on inactive or recommended sites.

DDanielAguirre
60% match