Skip to main content
SimilarExport ZIP
100%

Network

✓ Published0🌍 Public
Llukeod
Last edited Jun 28, 2020
Created on Jun 28, 2020
Forked from Network

This network visualization shows the relationships between characters from *Les Misérables*, with nodes colored by group and link thickness representing connection strength. The force-directed layout uses `d3.forceSimulation` with link, many-body charge, and center forces to position the SVG elements. The code loads JSON data, creates circles and lines, and updates their positions on each simulation tick using D3's selection API.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Network

A network diagram displays character relationships from Les Misérables, with nodes representing characters and links showing their connections. Node color encodes group membership via a categorical color scale, while link thickness reflects relationship weight. The visualization uses D3 v5's force simulation (`d3.forceSimulation`) with link, charge, and center forces to position nodes. SVG circles and lines render the graph, with positions updated on each simulation tick. Data comes from a JSON file containing character IDs and weighted links.

Jjuliaric
93% match
Loading thumbnail…

Network

A force-directed network graph displays characters and groups from *Les Misérables*, with nodes colored by category and directed links styled by relationship type, such as email or mention. The visualization relies on `d3.forceSimulation` with `forceLink`, `forceManyBody`, and `forceCenter` to position elements, rendered as SVG circles and lines. A custom `colorLegend` function generates two legends, using circles for node categories and rectangles for link types, while drag interactions let users reposition nodes. Data loads from a JSON file, and edge colors and arrow markers highlight connection semantics.

Aala-wahibi
93% match
Loading thumbnail…

Fork of Network

This force-directed network graph visualizes character relationships from Les Misérables, with nodes colored by group category (Document, Email, Person, Location, etc.) and link thickness scaled by connection value. The simulation uses d3.forceSimulation with forceLink, forceManyBody, and forceCenter to position nodes, while a colorLegend component renders the categorical color scale. SVG circles and lines are updated on each tick, and the data loads from a JSON file containing nodes and weighted links.

Xxbambambs
91% match
Loading thumbnail…

Network

A network diagram renders character relationships from *Les Misérables*, with nodes colored by group type and link thickness encoding connection weight. D3’s force simulation (`d3.forceSimulation`, `forceLink`, `forceManyBody`, `forceCenter`) positions nodes and updates SVG circles and lines on each tick. A color legend, built through a custom `colorLegend` module, maps categorical domains to a color scale. Data comes from a local JSON file.

Aala-wahibi
91% match
Loading thumbnail…

Fork of Network

This network graph visualizes character relationships from Les Misérables, with nodes representing characters colored by group membership and link thickness reflecting interaction strength. The SVG visualization uses d3.forceSimulation with forceLink, forceManyBody, and forceCenter to position nodes, while d3.select and data joins render circles and lines. Node colors come from a d3.scaleOrdinal with schemeCategory10, and the simulation tick event updates element positions dynamically.

Yyejichun@naver.com
91% match
Loading thumbnail…

Network

This network visualization maps character co-occurrences in Victor Hugo's *Les Misérables*, using color-coded nodes to represent categorical groups such as Document, Location, and Person. The force-directed layout, driven by `d3.forceSimulation` with link, charge, and centering forces, positions characters and their relationships. A color legend, built with a custom `colorLegend` function and `d3.scaleOrdinal`, clarifies the group assignments. The SVG rendering uses a loaded JSON dataset, and link thickness encodes relationship strength.

Aala-wahibi
90% match
Loading thumbnail…

(*^^*)

A force-directed network diagram displays the relationships among characters in the novel *Les Misérables*. Nodes represent individual characters, colored by their community group, while links indicate co-appearance, with line thickness proportional to interaction strength. Nodes can be dragged interactively, causing the simulation to adjust the layout. The visualization uses `d3.forceSimulation` for physics, `d3.drag` for node manipulation, and `d3.schemePaired` for categorical coloring, rendering in SVG within a React framework. Data is loaded from a JSON file hosted on GitHub.

CCyc-Evelyn
90% match
Loading thumbnail…

Fork of Network

This example visualizes a small network of characters from *Les Misérables*, colored by group and connected by a single link. Using D3.js v5, it loads data from a JSON file and applies a force-directed layout via `d3.forceSimulation`, `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter`. Circles represent nodes in SVG, positioned dynamically on each simulation tick, while lines show edges with stroke width proportional to link value. Node colors come from a `d3.scaleOrdinal` with `d3.schemeCategory10`.

SSnapika
90% match