TP 6 DataViz 1

100%

TP 6 DataViz 1

✓ Published0🌍 Public

Last edited Dec 21, 2016

Created on Dec 8, 2016

A force-directed network graph displays relationships between French National Assembly members based on shared voting patterns. Nodes represent individual politicians, while links connect pairs who voted together frequently in legislative roll calls. The graph is generated from two JSON datasets: vote records (`scrutins.json`) and member information (`acteurs_simple2.json`). Using D3.js v4, the visualization applies `d3.forceSimulation` with link, many-body, and centering forces to position nodes, and renders as SVG circles and lines. The code includes a drag-and-drop interaction that temporarily increases simulation alpha for manual exploration.

AI-generated description

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/nbonneel/'>nbonneel</a>'s block: <a href='http://bl.ocks.org/nbonneel/91f6d433810029851e170ba668436340'>TP 6 DataViz</a>

mit Licensed

Similar vizzes

Loading thumbnail…

TP 6 DataViz 2

A force-directed network graph maps voting patterns among French National Assembly members, filtering links to those with at least 15 shared votes. Nodes are colored by political group and labeled with member names and affiliations. The visualization uses D3 v4’s `d3.forceSimulation`, `d3.forceLink`, and `d3.forceManyBody` with SVG rendering. Data comes from the `scrutins.json` parliamentary roll-call votes and `acteurs_simple2.json` member metadata, loaded via the `queue` library.

LLaippe

96% match

Loading thumbnail…

TP 6 : Vote à l'assemblée

The visualization shows a network of French National Assembly members and their voting positions on a specific ballot, grouped by political affiliation. It uses a force-directed graph layout where nodes represent individual legislators and links indicate shared voting behavior, with node colors encoding party groups. The graph is rendered as an SVG using D3.js v4, with the `d3.forceSimulation` API handling the physics-based layout (link forces, many-body repulsion, and centering). Data comes from the `scrutins.json` file, which contains the official roll-call vote records, detailing how each deputy voted.

MMelanieSalignat

90% match

Loading thumbnail…

TP 6

This example visualizes voting patterns among French parliamentary actors during 2015, showing a network of lawmakers connected by shared votes. It uses a force-directed graph built with `d3.forceSimulation` and SVG rendering, where nodes represent individual actors and links indicate pairs who voted identically on a given scrutin. The code processes `scrutins.json` data, counting co-votes for both "pour" and "contre" positions, then filters links to include only those with more than 20 shared votes. Node colors are assigned via `d3.scaleOrdinal` with `d3.schemeCategory20`.

BBrunoDumas

89% match

Loading thumbnail…

TP6 (V5)

A network visualization displays French parliamentarians as colored nodes, linked by shared voting patterns, with node color representing political group and link thickness indicating vote similarity. The interactive force-directed layout uses d3.forceSimulation with link, charge, and center forces, allowing nodes to be dragged. Built with D3 v4 and rendered as SVG, it loads JSON data for the graph and a CSV for the legend.

JJeremyBesson

87% match

Loading thumbnail…

TP6 (V6)

A force-directed network diagram maps the voting cohesion of French parliament members, with nodes colored by political group and link thickness indicating voting agreement scores. The visualization uses d3.forceSimulation with link, charge, and center forces, rendering SVG circles and lines. Node drag interaction is enabled via d3.drag, and a legend built from CSV data identifies each group's color. The JSON dataset provides individual member names, group IDs, and pairwise voting scores.

JJeremyBesson

87% match

Loading thumbnail…

TP6 (V3)

This network visualization shows connections between French parliament members, with each node colored by political group and a legend identifying those groups. The code uses d3.forceSimulation with link and charge forces to position nodes, while drag interactions let users rearrange the graph. Node and link data come from JSON files, with group names loaded from a CSV. Rendering is done via SVG elements, with node labels available as tooltips and link thickness scaled by connection strength.

JJeremyBesson

86% match

Loading thumbnail…

TP6 (V4)

This network diagram displays the voting relationships among French parliament members, with each node representing a deputy and each link indicating a shared voting record. Node color encodes the deputy’s political group (per the `nomGroupes.csv` legend), while link thickness reflects the strength of the relationship, as drawn from the `scoreParlementaire.json` dataset. The visualization uses d3.v4 with `d3.forceSimulation`, `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter` to compute the force-directed layout, and renders nodes as SVG circles that users can drag to reposition.

JJeremyBesson

86% match

Loading thumbnail…

TP6 (V2)

This example visualizes a network of French parliament members, showing connections between them with node color indicating political group affiliation and link thickness representing tie strength. It uses a force-directed graph layout via `d3.forceSimulation` with link, charge, and center forces, rendering nodes and links as SVG elements. Node colors map to party groups using a custom `d3.scaleOrdinal`, and a legend generated from CSV data labels each color. The graph loads data from JSON and CSV files, and supports dragging nodes to reposition the simulation.

JJeremyBesson

84% match