knmalinski

@knmalinski·3 public vizzes

CSS Colours

This example visualizes the named colors of the CSS color specification as a scatterplot-like display. It uses D3 v3 to fetch a CSV file of color names and their corresponding RGB values, then renders each color as a distinct visual element based on its hue and lightness. The code employs D3’s asynchronous data loading and text parsing to process the external dataset. The result is a compact survey of the standard CSS color palette, organized to reveal relationships and distribution across the color space.

Apr 18, 2021

Loading thumbnail…

Smiley Face Part II

Fifteen randomly generated smiley faces render in a grid, each with variations in eye size and a fixed mouth shape. The faces are composed of reusable React components—`BackgroundCircle`, `Eyes`, `Mouth`, and `FaceContainer`—which assemble SVG elements using props. Mouth paths are generated with the `d3.arc` API, while `Math.random()` in the component’s map function varies eye radius. The SVG output is rendered via ReactDOM, and the index.html loads React, ReactDOM, and D3 v6 from CDN.

Apr 18, 2021

Loading thumbnail…

Fork of Hello HTML

This example displays a minimal HTML page that renders the text “Hello World!” as a heading. It serves as a basic introduction to web page structure, loading no external libraries or data. The page consists solely of an `<h1>` element inside a standard HTML document, with no JavaScript or CSS involved. The rendering approach is the browser’s default handling of static HTML content, demonstrating the simplest possible data-visualization setup.

Apr 18, 2021