chrischism8063

@chrischism8063·3 public vizzes

Customizing Axes

A horizontal bar chart displays population estimates for 25 countries in 2020, ranked from most to least populous. The chart reads from a CSV file and uses D3's `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the visualization. Custom tick formatting converts large numbers into abbreviated text, replacing "G" with "B" for billions. The SVG output includes a title, axis labels, and styled bars with a steelblue fill.

Jul 25, 2019

Loading thumbnail…

Making a simple bar chart

This example displays a horizontal bar chart ranking 24 countries by their 2020 populations, with values read from a CSV file and scaled linearly along the x-axis while countries are positioned on a categorical band scale. The SVG rendering uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the axes, while bars are appended as `rect` elements and styled with steelblue fills. Population figures are multiplied by 1,000 after loading to reflect actual counts.

Jul 19, 2019

Loading thumbnail…

HTML Cars report

This example displays a simple, static HTML report titled "Cars Report" listing three Nissan vehicles with their respective prices. The page uses plain HTML markup within an `index.html` file, styled by an external `styles.css` that imports the Ubuntu font from Google Fonts and applies a dark blue background with light text. The body is centered and scaled to a large font size, with the list presented as an unordered list. No JavaScript libraries or dynamic data-binding are involved; the content is hardcoded directly in the HTML.

Jul 7, 2019