Fork of Impact of Covid-19 on Employment Bar Graph

Impact of Covid-19 on Employment Bar Graph

A horizontal bar chart shows the percentage of working hours lost per week (relative to a 40-hour baseline) across 14 countries during the Covid-19 pandemic. The visualization uses React with D3 v5 APIs, including `scaleBand` for the categorical country axis, `scaleLinear` for the numerical percentage axis, and `csv` to load remote employment data. Each country’s bar is rendered as an SVG `rect`, with red tick lines and axis labels drawn manually. The chart communicates relative economic disruption by sorting countries from largest to smallest percentage loss.

93% match

female lost working during covid Bar Graph

This bar chart visualizes the impact of COVID-19 on female employment by showing the number of employed women aged 25 and older in 2019 for ten countries. The code uses React with a D3.js v5 CSV data loader, mapping each country to a horizontal bar whose length reflects the employment figure. The visualization is rendered as an SVG, with D3’s `scaleBand` and `scaleLinear` handling the axes and bar dimensions, and tick marks drawn manually from the x-scale.

84% match

male working during covid Bar Graph

This bar graph shows the impact of COVID-19 on male employment rates across ten countries, comparing 2019 employment figures for men aged 25 and older. The visualization uses a horizontal bar chart with countries listed along the y-axis and employment percentages along the x-axis. Built with React and d3.v5, the code loads data from a CSV file using d3.csv and renders SVG rectangles scaled by d3.scaleLinear and d3.scaleBand. Red gridlines mark tick values on the linear x-axis, while country labels appear beside each bar.

82% match

Covid-19 Scatter Plot

This scatter plot visualizes the relationship between the percentage of working hours lost and the number of employed males aged 25 or older in 2019 across different countries, with each circle’s size varying by total weekly hours worked and color-coded by country. The visualization is built with React and D3 v5, using `d3.csv` to load data from a remote Gist URL, `d3.scaleLinear` for axes, and `d3.axisLeft`/`d3.axisBottom` for axis rendering. Points are drawn as SVG circles via the `join` operation, with a fixed radius of 5 pixels, while axis labels and a title are added as SVG text elements.

80% match

COVID-19

This interactive COVID-19 dashboard displays country-level statistics using horizontal bars. Users select an attribute from a dropdown, and React state updates the chart to show that metric. Driven by a CSV of global pandemic data, the visualization renders bars with SVG rectangles via React components, using D3 scales (`scaleBand`, `scaleLinear`) and axes (`AxisBottom`, `AxisLeft`) to position the data. Tooltips appear on hover through SVG `<title>` elements.

WW9183907

DataViz Project - Second Visualization

This interactive bar chart compares unemployment rates and mental illness prevalence across the five most affected countries for a selected year. Users can switch between 1995, 2000, 2005, 2010, and 2015 via a React dropdown menu. The visualization uses React hooks, d3.scaleBand and d3.scaleLinear for axes, and d3.csv to load the mental health dataset from a GitHub gist. Hovering over the color legend highlights corresponding bars and fades others, with tooltips showing exact values.

FFelipe Mejías

Bar graph of covid deaths

A horizontal bar chart visualizes COVID-19’s new deaths on May 31 for ten selected countries, using a green fill for each bar and sorting the locations by death count. The visualization is built with React and D3 v5, employing `scaleBand` for the categorical y-axis and `scaleLinear` for the x-axis, with SVG rendering. Tooltips, created via the `<title>` element, display the country name and total cases, while the data is sourced from the COVID MAY Dataset on GitHub.

Mmanasishrotri

Fork of Stylized Bar Chart

This interactive bar chart displays the 15 countries with the highest total COVID-19 cases, using data from Our World in Data. The visualization uses React components with D3.js scales (scaleBand and scaleLinear) to render horizontal bars in SVG, with axes generated by custom AxisBottom and AxisLeft components. A tooltip showing formatted population values appears when hovering over each bar, and the chart includes a Population axis label with data formatted using D3’s `format` function.

Aamanoakane