kartikaymanoj

@kartikaymanoj·3 public vizzes

Untitled

This visualization maps migrant casualties across the Mediterranean, plotting individual events by geographic coordinates and encoding severity through point size or opacity. It uses SVG for rendering and loads D3 v5 via `select` and `csv` to parse the dataset from `data.csv`. The map displays location, date, and casualty counts for each reported incident, sourced from news reports and route classifications. However, the current code only logs the data to the console, not yet rendering the visual elements.

Feb 9, 2020

Loading thumbnail…

Let's make a face with D3.js!

This example uses D3.js to build a cartoon face from basic SVG shapes, including a yellow circle for the head, circles for eyes, rectangles for eyebrows, and an arc-based path for the mouth. The code relies on D3’s `select`, `arc`, and `transition` APIs to arrange elements around a central group, with eyebrow positions animated through chained `transition.attr` calls that raise and lower them over 2 and 1 seconds. The rendered output is an SVG canvas sized 960 by 500 pixels, with styling defined in a linked CSS file.

Feb 9, 2020

Loading thumbnail…

Let's make a face with D3.js!

A playful D3.js example builds a cartoon face from SVG shapes, showing a yellow circle with black-outlined eyes, animated eyebrows, and an arc-based smile. It renders entirely in SVG within a 960×500 viewport, using `d3.select`, `d3.arc`, and chained `transition` calls to animate the eyebrows upward and back over three seconds. The face is centered via a group transform, with fixed pixel constants for eye spacing, radius, and eyebrow dimensions. No external data is loaded, as all geometry is hardcoded in JavaScript.

Feb 9, 2020