Joris Compernol

@comoris·2 public vizzes

Link Tree Viz of World Countries

This example displays five circles and five rectangles representing score and population data, with circle size and opacity mapped to scores and bar width corresponding to city populations. Built with React and D3 v5, it uses SVG selections and data joins to bind arrays from `scores.js` and inline city objects. Circles are styled conditionally via CSS classes, while rectangles change fill on hover.

Aug 6, 2020

Loading thumbnail…

Link Tree Viz of World Countries

This visualization displays a hierarchical tree of world countries as an interactive node-link diagram. The view uses blue circles for nodes and curved, arrow-headed paths for directed links, with all elements offset vertically by 150 pixels. The implementation relies on D3 v5's `linkHorizontal` generator to create smooth horizontal curves between connected nodes, while data is loaded from a local JSON file via `d3.json`. The SVG rendering positions nodes based on explicit x,y coordinates from the data, and the visualization includes marker definitions for the arrow tips.

Jul 29, 2020