patrick-abdullahad

@patrick-abdullahad·2 public vizzes

Fork of Let's make a face with D3.js!

This bar chart shows the populations of the ten most populous countries in the world, based on 2020 data from the United Nations. Using D3 v5, the visualization employs `d3.scaleLinear` and `d3.scaleBand` to map population values and country names, with `d3.axisLeft` and `d3.axisBottom` for the axes. Data is loaded from a CSV file via `d3.csv`, and rectangles are appended to an SVG to represent each country, styled with a steel blue fill.

Jun 15, 2021

Loading thumbnail…

Fork of Let's make a Bar Chart

This example uses D3.js v5 to build an animated smiley face entirely from SVG shapes. A yellow circle forms the face, with two smaller circles as eyes and an arc path for the mouth. The code demonstrates fundamental DOM manipulation by appending elements to a group and using `transition` to animate rectangular eyebrows up and down over two seconds. It showcases basic shape construction, attribute setting, and chained transitions through D3’s selection API, with no external data source, relying solely on hardcoded dimensions for layout.

Jun 7, 2021