GS500

@GS500·2 public vizzes

Making a Bar Chart with D3.js

This example demonstrates a basic bar chart built with D3.js, mapping country populations from a CSV file to SVG rectangles. The code uses `d3.csv` to load the data, `d3.scaleLinear` for scaling, and `selection.enter()` to append rectangular elements. The chart reads the data.csv file, multiplies population values by 1,000, and renders static 300-by-300-pixel bars without axes or labels.

Oct 16, 2020

Loading thumbnail…

Smiley Face Part II

This example shows a React-rendered SVG smiley face, centered on a full-window canvas with a yellow circular head, black stroke outline, and two black eyes. The face omits a mouth, using only the head and eyes. The code builds the visualization with React and ReactDOM, computing the window dimensions and center coordinates dynamically, then rendering nested SVG circle elements for the head, eyes, and stroke, with stroke-width, position, and radius values derived from the window size.

Oct 16, 2020