Cynthia Mengyuan Li

@cynthialmy·2 public vizzes

Fork of Smiley Face Part III

This example shows a classic smiley face rendered as a static SVG graphic, with a yellow circular head, two black eyes, and a curved mouth. Using React 16.9 for component structure and D3 v5’s `arc` generator, it calculates the mouth path with specified inner and outer radii and start and end angles. The face is centered via a translation transform, with all shapes drawn as SVG circles and a path element.

Jan 13, 2023

Loading thumbnail…

Smiley Face Part I

A static smiley face rendered as SVG elements: a yellow circle with a black outline, two smaller black circles for eyes, and no mouth. The example uses React 18 and ReactDOM to manage the SVG markup, though the page loads a compiled bundle with a typo in the script tag. The SVG has a fixed 960 by 500 viewport, with circles positioned using explicit `cx` and `cy` coordinates.

Jan 13, 2023