Scubaman911

@Scubaman911·3 public vizzes

Making a bar chart

This bar chart shows the populations of the ten most populous countries, based on 2018 estimates from the United Nations World Population Prospects. The horizontal bars are rendered as SVG rectangles, with lengths scaled linearly to population values, while country names are positioned on a band scale. The visualization uses D3 v5 APIs such as `csv` for data loading, `scaleLinear` and `scaleBand` for encoding, and `axisLeft` and `axisBottom` for tick marks. A steelblue fill style is applied via CSS.

Nov 2, 2019

Loading thumbnail…

Customizing Axes

This bar chart displays the top 10 most populous countries using 2018 United Nations population estimates, with China and India leading by a wide margin. The example focuses on customizing D3 axes, removing default domain lines and using tick lines as horizontal gridlines. It employs `d3.csv`, `d3.scaleLinear`, `d3.scaleBand`, `d3.axisLeft`, and `d3.axisBottom`, with custom tick formatting that converts billions to abbreviated labels. The SVG rendering includes styled tick text, an axis label, and a chart title, all defined through CSS classes.

Nov 1, 2019

Loading thumbnail…

Customizing Axes

This bar chart displays the population of the top 10 most populous countries, using 2018 estimates from the United Nations World Population Prospects. It shows how D3 axes can be customized: the x-axis uses a custom tick format to abbreviate large numbers (converting G to B), and grid lines extend across the chart. The y-axis removes its domain line and tick marks for a cleaner look. The visualization is built with d3.scaleLinear, d3.scaleBand, d3.axisBottom, and d3.csv, rendering as SVG.

Nov 1, 2019