timed graph v2

100%

timed graph v2

✓ Published0🌍 Public

Last edited Apr 6, 2018

Created on Apr 6, 2018

This visualization maps a citation network of psychology publications as an animated force-directed graph. Nodes represent papers, sized by citation count and colored by cluster, while links connect citing works. The y-axis is fixed to publication year, and an animated simulation from d3.forceSimulation positions nodes using link, charge, and center forces. Hovering reveals paper details via a tooltip. Data comes from a local JSON file, rendered as SVG with D3 v4.

AI-generated description

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/MNoichl/'>MNoichl</a>'s block: <a href='http://bl.ocks.org/MNoichl/ddab0c28015015d4ba281c45578ee764'>timed graph v2</a>

mit Licensed

Similar vizzes

Loading thumbnail…

timed graph v2

This interactive network visualization displays citation relationships between academic papers in clinical psychology, with publications positioned along a timeline based on publication year. Circles represent individual papers, with size corresponding to citation count and color indicating cluster membership, while connecting lines show citation links and their temporal gaps. Users can hover over nodes to view detailed paper information and drag nodes to rearrange the layout. The visualization uses d3.forceSimulation for the physics-based layout, d3.scaleTime for the chronological axis, and d3.scaleOrdinal for cluster coloring, rendering as animated SVG elements with tooltip interactions.

MMNoichl

93% match

Loading thumbnail…

economist net

This network visualization maps the citation relationships between academic papers in clinical psychology. The view uses a force-directed simulation where nodes represent papers, with their vertical position locked to their publication year and their size scaled by citation count. The code builds this using `d3.forceSimulation`, `d3.forceLink`, and a custom `ticked` function that fixes the y-coordinate based on the paper’s `PY` attribute. Hovering a circle reveals a tooltip with the paper’s full title, author, and source.

MMNoichl

82% match

Loading thumbnail…

Force-Directed Graph

A force-directed graph shows citation relationships among academic papers on intelligence and race, with nodes representing publications and links indicating citations. The visualization uses D3 v4's `d3.forceSimulation` with link, charge, and centering forces, and renders continuously to a Canvas 2D context. Node positions update on each simulation tick, drawing links as gray lines and nodes as white-stroked circles. Data comes from the embedded `miserables.json` file, which includes paper metadata like authors, year, and citation scores.

MMNoichl

81% match

Loading thumbnail…

Concentric circle force layout graph in D3.v4

This example visualizes a network of research papers on Real-Time Bidding for online advertising, showing papers as nodes and citations as links. The force-directed layout organizes papers into concentric circles by publication year, with more recent papers near the center. Nodes are colored by year and are draggable, with the graph supporting zooming and panning. The visualization uses D3.v4's `forceSimulation` API with `forceLink`, `forceManyBody`, `forceCenter`, and `forceCollide` forces to compute dynamic node positions. It renders nodes and links as SVG elements with animated transitions, and loads paper metadata from a JSON data file. Zoom interaction is implemented via D3's `zoom` object with configurable scale extents.

FFrissAnalytics

77% match

Loading thumbnail…

Network

This example visualizes a network of academic citations using D3.js v5 within a Vue framework. A force-directed simulation positions nodes representing publications, with circle size and color mapping to citation counts and group membership, while links show citation relationships with thickness proportional to strength. The visualization uses `d3.forceSimulation`, `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter` to compute layout, rendered as SVG elements. Node and link positions update on each simulation tick, displaying data loaded from a JSON file.

AAlex7722

77% match

Loading thumbnail…

timed graph, psychology on race

A timed force-directed graph visualizes the temporal unfolding of a controversial debate on race and IQ in psychology. Nodes, colored by cluster, burst outward from a horizontal time axis, their vertical position fixed by publication year while the simulation, driven by `d3.forceSimulation` with link, charge, and center forces, positions them horizontally. Hovering a node reveals a tooltip with its label, title, source, and year. The visualization renders as an animated SVG using data from `race.json`.

MMNoichl

76% match

Loading thumbnail…

D3 Tutorial

This example demonstrates a D3.js network graph visualizing a force-directed layout of research papers, with nodes sized by their citing patents count. The chart uses the `d3.forceSimulation` API to position nodes and render them as SVG circles on a 960x500 canvas, with forces for charge and centering. Data is loaded asynchronously from a static JSON file using `d3.json`. The visualization highlights the strongest-cited works through larger radii, making publication impact immediately apparent.

SShivansh Mathur

74% match

Loading thumbnail…

D3 viz

A force-directed graph displays a network of academic papers, where each node represents a cited work and its size reflects the number of citing patents. The visualization uses `d3.forceSimulation` to position nodes and `d3.drag` for interactive dragging. Yellow circles are rendered as SVG elements within a fixed 600x600 viewport. The data, containing paper titles and patent counts, is supplied locally in the script.

AArmin van Eldik

73% match