Andrew Merizalde

@amerizalde·2 public vizzes

Smiley Face 2

A smiling face rendered as SVG using React components for the background circle and eyes, with a mouth path generated by d3’s `arc` function. The face is centered via a translated `<g>` group, and the eyes include white and black circles with fixed stroke widths. The code imports React, ReactDOM, and d3, and uses JSX to compose the visualization. Data consists of hardcoded dimensions for the SVG canvas, circle radii, and eye positioning, with no external dataset.

Mar 12, 2021

Loading thumbnail…

HTML Starter tut

This example shows a simple smiley face rendered as an SVG graphic inside a React component. The face uses D3’s `arc` generator to draw the mouth, while circles form the head and eyes, with a yellow fill and black stroke. React renders the SVG into a root `div`, and D3 v6 is loaded alongside React 16 via CDN. The code also demonstrates basic JavaScript logging and JSX syntax for beginners.

Mar 12, 2021