Tell us what works and what could be better. We read every submission.
@nutriologaaranzaperea-cmd·2 public vizzes
This example shows a horizontal bar chart of country populations for the year 2020, sourced from the UN Population 2019 dataset. Rendered as SVG via React components, it uses d3.scaleBand for the y-axis and d3.scaleLinear for the x-axis, with separate AxisBottom, AxisLeft, and Marks components. The code loads data asynchronously with d3.csv and slices the first ten entries, while the axes and bars are generated using React’s map function and JSX.
This visualization shows a horizontal bar chart of categorical data, where bar lengths are proportional to numeric values. Built with React and D3 v5, it uses `scaleBand` for the y-axis categories and `scaleLinear` for the x-axis values, rendering bars as SVG rectangles. The chart includes formatted tick labels (converting large numbers to abbreviations like “B” for billions), axis labels, and tooltips showing exact values on hover. Data is loaded from an external CSV source via D3’s `csv` function, with the first ten rows displayed.