alismath

@alismath·2 public vizzes

D3 Page Template

This example shows a minimal D3 page template that appends a new paragraph element to the body of an HTML document. The code uses the D3 selection method `d3.select("body").append("p")` to add the element, then sets its text content to "New paragraph!" via the `.text()` method. The page loads D3 from a local file and demonstrates the fundamental pattern of chaining D3 methods to manipulate the DOM. No data is involved; it is a bare-bones starting point for more complex visualizations.

Jan 31, 2022

Loading thumbnail…

Smiley Face

A yellow smiley face rendered as a scalable vector graphic (SVG) sits at the center of a 960×500 canvas. A bold black circle outlines the yellow face, with two black eyes and a thick smile drawn using an SVG path. The code uses React to structure the SVG elements and D3 v7's `arc` generator to compute the mouth's curved path based on inner and outer radii and start and end angles. The geometric coordinates for the face, eyes, and stroke are calculated dynamically from the canvas dimensions and fixed offsets.

Jan 15, 2022