hienng9

@hienng9·3 public vizzes

Fork of Missing Migrants Date Histogram

This visualization shows the total number of dead and missing migrants per month over time, using a date histogram built with React and D3 v5. The code employs `d3.bin` with `timeMonths` thresholds to group data into monthly bins and `d3.sum` to aggregate the “Total Dead and Missing” values within each bin. Axes are rendered as SVG elements using reusable React components, with scales created via `d3.scaleTime` and `d3.scaleLinear`. Data comes from the Missing Migrants Dataset loaded through `d3.csv`.

Aug 24, 2023

Loading thumbnail…

Smiley Faces

A grid of smiley faces displays random variations in eye size and mouth width. Each face is built from composable React components: a yellow `BackgroundCircle`, two `Eyes`, and a `Mouth` path generated with D3's `arc` for a half-circle smile. The SVG faces are rendered via `ReactDOM.render` inside a `FaceContainer` that translates the center point. Random values for `eyeRadius` and `mouthWidth` are applied on every render, creating a playful sequence of subtly different expressions.

Dec 6, 2021

Loading thumbnail…

A smiley face

This visualization shows a simple web page displaying the message “Hello HTML!” against a blank canvas. The example demonstrates the basic structure of an HTML document with inline CSS styling that resets margins and hides overflow. It uses no external libraries or data sources, relying solely on native HTML elements and CSS rules to render the text in the browser. The page serves as a minimal starting point for building more complex visualizations.

Dec 6, 2021