Philip W

@PhilipYYW·2 public vizzes

JavaScript Arrays

This example visualizes JavaScript array operations as an interactive force-directed graph. The display maps array elements to nodes, with edges representing relationships, while the layout uses d3.forceSimulation to position elements organically. The implementation relies on D3.js version 6.6.2, specifically the force-directed graph API for physics-based node placement and collision detection. Node positions update dynamically through the simulation loop, demonstrating the structural connections within JavaScript arrays.

Dec 22, 2025

Loading thumbnail…

SVG Fundamental

This example creates a full-screen SVG image built entirely from programmatically generated rectangles. It demonstrates two different mask patterns that reveal a central circular area, with one mask applied to horizontal bars and another to vertical bars. The code uses D3.js version 6.6.1, specifically the `selection` module, alongside vanilla JavaScript DOM manipulation with `document.createElementNS` and SVG attributes. The rendering approach shows raw SVG element creation without using D3's data join or helper functions.

Dec 22, 2025