Daniel

@daalv·2 public vizzes

VIS2

This interactive visualization displays a filtered collection of over 20,000 board games as a hexagonal grid, using a random seeded layout to position games. Users can filter by player count and category via dropdown menus, with the top 104 ranked games shown as hexagons sized by ranking. Built with D3.js (d3-hexbin, d3-collection, d3-seedrandom), it renders SVG hexagons over a canvas and includes zoom and pan navigation, while tooltips show game details on hover. The visualization animates transitions when filters change, and data comes from a CSV of board game attributes.

Jun 16, 2021

Loading thumbnail…

VIS

This visualization displays a hierarchical tree of global data center locations, organized by geographic region and country. Users can collapse and expand branches by clicking on nodes, with animated transitions that smoothly reposition elements. The visualization uses D3's tree layout and hierarchy functions to compute node positions, while SVG paths render the connecting links. Built with d3-collection for data manipulation, the code implements zoom and pan controls through d3.zoom, and animations utilize transition methods with customizable duration based on Alt key input.

Apr 19, 2021