Felicity Wu

@felicityandherdragon·2 public vizzes

Fork of D3 Selection Exploration

This example demonstrates a set of animated circles whose vertical positions and radii oscillate smoothly over time, creating a wave-like pattern across the screen. The visualization uses the D3.js library (v6.6.2) to create an SVG canvas and a custom `join` operation for incremental updates. A timer-driven loop in JavaScript updates the data every 60 frames per second, while the `makeData` function generates new values using trigonometric functions (sine and cosine) based on a time variable. The code leverages D3's `select` and `range` utilities to manage the dynamic rendering, though the circles simply move continuously without any direct user interaction.

Nov 14, 2023

Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3 - reference

This example reproduces a Sol LeWitt art piece using D3 v6. It renders two sets of translucent black-and-white striped rectangles overlaid with masks, creating a grid of alternating symbols. The code uses `d3.select`, `d3.range`, `d3.symbol`, `d3.symbols`, `d3.scaleBand`, and SVG masks. Each mask layers vertically and horizontally offset rectangles with D3 symbol paths, alternating white and black fills to generate overlapping geometric patterns. The page fills the browser window with 120 stripes per axis, using inlined SVG without external data.

Nov 12, 2023