yeezhu112

@yeezhu112·5 public vizzes

For the top growth countires, the curve flattening never stablized

This visualization tracks cumulative COVID-19 cases in the top ten affected countries from January to July 2020, using a multi-line chart with animated line drawing. The y-axis shows the number of cases on a linear scale, while the x-axis represents time, with each country assigned a distinct color from a categorical scale. The visualization uses D3 v5 with `d3.line`, `d3.curveBasis`, `d3.nest`, and `transition.attr` to animate the stroke-dashoffset, revealing each country’s growth trajectory. A color legend identifies each country, and the data comes from a CSV file with daily case counts.

Aug 2, 2020

Loading thumbnail…

For most of retail industries, the growth is haulted by COVID-19. The seasonal growt is also dimished by the impact of COVID-19.

This interactive line chart visualizes monthly retail growth compared with the same month last year across industries, revealing how COVID-19 halted growth and dampened seasonal patterns. The chart compares 2019 and 2020 data from the RetailGrowth.csv file, using d3.scaleTime, d3.scaleLinear, and d3.scaleOrdinal for axes and color encoding. A d3.Delaunay Voronoi overlay enables hover interactions, highlighting the nearest data point and its corresponding industry line, while a tooltip displays the exact growth or reduction percentage.

Aug 2, 2020

Loading thumbnail…

Homepage

This homepage presents a curated collection of COVID-19 impact visualizations, linking to external dashboards for global case distributions, real estate, and retail sectors. The page uses plain HTML with JavaScript’s `window.location.assign` to redirect to a Tableau Public dashboard, while hyperlinks connect to VizHub-hosted interactive charts. Styling is handled with CSS for font sizing and emphasis. It does not render data directly, serving instead as a navigation hub for related visual projects.

Aug 2, 2020

Loading thumbnail…

The housing market was greatly impacted in March and April. However, the impact was reversed quickly since June.

Three overlaid line charts compare average new housing listings across 2018, 2019, and 2020, highlighting a sharp decline in March and April 2020 followed by a rapid recovery by June. The visualization uses React with D3 v5 scales and line generators with curveBasis, rendering to SVG. Red, blue, and black paths represent each year, while dropdown menus allow switching between x-axis attributes like day of year and y-axis metrics such as average listings. Data comes from Redfin’s data center.

Aug 2, 2020

Loading thumbnail…

Interactive Color Legend

This example visualizes the Iris dataset as a scatter plot of petal length against sepal width, with points colored by species. An interactive color legend allows hovering over a species name to fade all other points and highlight only the selected species. The visualization is built with React and D3 v5, using d3.scaleLinear for axes, d3.scaleOrdinal for the color mapping, and SVG circles rendered through React components. Data is loaded asynchronously from a CSV file via d3.csv.

Aug 2, 2020