shihai832

@shihai832·3 public vizzes

Customizing Axes

This bar chart displays the populations of the top 10 most populous countries, based on 2018 estimates from the United Nations World Population Prospects. It demonstrates how to customize D3 axes by removing domain lines, adjusting tick sizes, and reformatting tick labels to abbreviate large numbers. The visualization uses d3.csv to load data, d3.scaleLinear and d3.scaleBand for positioning, and d3.axisLeft and d3.axisBottom for the axes, with all marks rendered as SVG rectangles.

Apr 8, 2020

Loading thumbnail…

HTML Starter

This example displays the text “Hello HTML” centered in large type. It uses a plain HTML file with embedded CSS to style the body with center alignment and a font size of 13em. The page demonstrates the minimal structure of an HTML document, including the doctype, head, and body tags, making it a starting point for web-based visualization projects.

Apr 5, 2020

Loading thumbnail…

Parallel Coordinates

This parallel coordinates chart compares national happiness and social participation across countries in nine dimensions, including religion, political party, and environmental groups. It uses D3 v3 with SVG paths, ordinal and linear scales, and `d3.svg.axis` for labeled axes. Users can drag axes to reorder dimensions, and brush along any axis to filter foreground lines, which highlight matching countries from the CSV data while grey background lines show the full context. The code applies a transition for smooth reordering.

Mar 31, 2020