David Sanderson

@d-sanderson·3 public vizzes

Fork of D3 Starter

This example loads tweet data from a local JSON file and immediately displays it in a browser alert, serving as a minimal starter for D3-based projects. The code uses d3.json to fetch the data, while the SVG container is set up in the HTML with dimensions of 960 by 500 pixels. The visualization itself is not yet implemented; the project simply demonstrates the basic structure of a D3 v6 application with an external data source.

Apr 10, 2021

Loading thumbnail…

Fork of Fork of D3 Starter

A grid of 40 white circles arranged horizontally on a black SVG canvas undulates vertically in a smooth, periodic wave, with each circle’s height determined by a sine function of its index and a shared time parameter. Using D3 v6, the example selects the SVG element, binds data to an array of 40 values, appends circle elements, and animates them with `d3.timer`, updating the `cy` attribute each frame. The rendering relies solely on D3’s selection and data-join methods without any external data source.

Apr 4, 2021

Loading thumbnail…

Fork of D3 Starter

This example shows a simple grid of 50 black circles arranged in a flexible wrapping layout across the page. The page initially contains a single div element, and the JavaScript loop appends 49 additional div elements directly to the document body. The circles are styled with CSS for size, background color, and rounded corners. The code uses the vanilla DOM API (`document.body.append` and `document.createElement`) rather than D3 selections, though the D3 v6 library is loaded via CDN but not actively utilized in the displayed behavior.

Apr 4, 2021