Colin

@colindjk·2 public vizzes

Stylized Bar Chart

This stylized bar chart displays the top 10 most populous countries using data from the United Nations World Population Prospects 2019. Horizontal bars are rendered as SVG rectangles, with country names on the y-axis and population values on the x-axis formatted in billions. The visualization is built with React components, using D3's scaleBand and scaleLinear APIs to position elements, and includes tooltips via SVG title elements. The chart uses a clean design with Poppins typography and teal-colored marks.

Sep 28, 2020

Loading thumbnail…

Stylized Scatter Plot

This scatter plot visualizes the Iris dataset, showing petal length against sepal width for iris flowers. Built with React and D3 v5, it renders as an SVG with axes generated by custom `AxisBottom` and `AxisLeft` components. The `Marks` component maps data points to circles with tooltips, while scales are created using `scaleLinear` and `extent`. Styling incorporates the Poppins font and a teal color scheme for the marks, with a loading state displayed until the CSV data loads via `useData` and `d3.csv`.

Sep 27, 2020