Covid-19 Scatter Plot

100%

Covid-19 Scatter Plot

✓ Published0🌍 Public

Last edited Apr 6, 2023

Created on Apr 6, 2023

Forked from Penguin Data set 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.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

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.

VVAbhiram99

82% match

Loading thumbnail…

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.

VVAbhiram99

82% match

Loading thumbnail…

Fork of Impact of Covid-19 on Employment Bar Graph

This bar chart visualizes the impact of COVID-19 on employment by displaying the percentage of hours lost for a 40-hour workweek across 14 countries. The visualization uses a horizontal bar layout, with each bar’s length encoding the data value, making it easy to compare losses between nations. Built with React and D3 v5, the chart employs `scaleBand` for the categorical country axis and `scaleLinear` for the quantitative percentage axis. Data is loaded asynchronously from a CSV file using D3’s `csv` function, while SVG rectangles render the bars, with axis ticks and labels drawn manually.

NNanditha Reddy

80% match

Loading thumbnail…

Working Hours Scatter Plot

A scatter plot displays the relationship between age and hours worked per week for individuals from the 1994 Census Income Data Set, with each point colored by gender. The visualization uses D3 v5's `scaleLinear`, `axisBottom`, and `axisLeft` APIs to construct the axes and gridlines, while `select` and `csv` load and bind the data. The SVG rendering applies a semi-transparent fill to each circle, and a legend distinguishes male and female data points. Hovering over a circle changes its fill to whitesmoke.

AAmar Nath Yogi

80% match

Loading thumbnail…

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.

VVAbhiram99

79% match

Loading thumbnail…

Scatter Plot for Covid data with Menus

A React-based scatter plot visualizes COVID-19 metrics from a May 2020 dataset, with dropdown menus controlling which two attributes (e.g., new cases, total deaths) map to the x- and y-axes. Points are colored by continent using a d3.scaleOrdinal color scale and a custom color legend. Built with d3.v5 for scales, axes, and SVG rendering, the chart uses React hooks (useState, useEffect) to manage state and load data via d3.csv, with interactive axes formatted using d3.format.

Mmanasishrotri

77% match

Loading thumbnail…

Working with Time

This scatter plot visualizes COVID-19 data, showing the daily increase in positive cases (y-axis) against time (x-axis) as a series of circular marks. The visualization uses React to render SVG elements, with D3 v5 scales including `scaleTime` and `scaleLinear` to map data to coordinates. The code employs `d3.csv` for data loading from a GitHub-hosted CSV file, with custom `AxisBottom` and `AxisLeft` components generating tick marks and labels. Each circle includes a native SVG `<title>` element for tooltips displaying formatted dates, and the chart is styled with the Poppins font.

Aanduskong

77% match

Loading thumbnail…

Scatter Plot for Covid data with Menus

This interactive bar chart displays total COVID-19 cases across ten countries for May 31st, using a vertical scale with country names and a horizontal linear scale for case counts. Built with React and D3 v5, the visualization renders SVG rectangles whose widths encode case numbers, with tooltips revealing exact values. Data comes from a CSV dataset loaded via D3's `csv` function, and the chart filters rows in `useData.js` to include only specified countries while sorting by location.

Mmanasishrotri

77% match