liuleirain

@liuleirain·3 public vizzes

Let's make a face with D3.js!

This example builds a simple bar chart from a CSV of country populations, rendering each row as a 300-by-300 pixel SVG rectangle. The code uses D3’s `select` and `csv` modules, parsing the population column and multiplying it by 1000 before appending the rectangles to the SVG element. The chart demonstrates basic D3 v6 data loading, attribute setting, and SVG rendering without axes or labels.

Nov 23, 2020

Loading thumbnail…

Let's make a face with D3.js!

This example shows a yellow smiley face built from SVG shapes, with its eyebrows smoothly sliding upward and then back down in a repeating animation. The code uses D3.js v5 selections to append a circle for the face, separate circles for the eyes, rectangles for the eyebrows, and a path generated with the `d3.arc` function for the mouth. Eyebrow movement is driven by chained `transition().duration()` calls that update the group’s `transform` attribute.

Nov 21, 2020

Loading thumbnail…

HTML Starter

A plain HTML page renders a static car report, displaying a heading and a single list item for a used Nissan Leaf at $1800. The code demonstrates fundamental web technologies: HTML markup for structure, inline CSS for font sizing, and a JavaScript console.log call that outputs a greeting to the browser's developer tools. No external libraries or frameworks are used. The page serves as a minimal, self-contained example of how CSS and JavaScript integrate with HTML, with no interactive behavior or data fetching.

Nov 21, 2020