Skip to main content
SimilarExport ZIP
100%

Data Visualization

✓ Published0🌍 Public
Mminsu_c
Last edited Aug 19, 2021
Created on Aug 19, 2021
Forked from HTML Starter

This dashboard presents multiple US statistics, including leading causes of death, state populations, food preferences, and federal minimum wage trends. The minimum wage chart visualizes historical wage data as an interactive line and scatter plot using d3.scaleTime, d3.line, and SVG circles, with tooltips showing exact values. The page also features donut and pie charts for survey responses, with buttons to filter by demographic groups. The SVG-based visualizations come from the CDC, Census Bureau, and YouGov data sources.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Final Project

This interactive visualization displays U.S. minimum wage trends from 1968 to 2017 using a dual choropleth map and line chart. Users click states to compare their minimum wage both in raw dollar values and adjusted 2018 dollars, with the line chart updating to show historical trajectories for selected states. A slider allows browsing different years. The visualization uses d3.geoPath for map rendering, d3.scaleLinear for color encoding, and d3.line for the time-series data, sourced from Kaggle. A color legend helps interpret the wage ranges.

RRobert Curtis
76% match
Loading thumbnail…

Minimum Wage Scatter Plot with Interaction Menus

This scatter plot displays US minimum wage data by state from 1968 to 2017, sourced from Kaggle, with interactive dropdown menus to select which columns to plot on the x- and y-axes. The visualization uses D3 v5 with scaleLinear axes, axisBottom and axisLeft for gridlines, and animated circle transitions via transition().duration() with staggered delays. Data is loaded using d3.csv, and the dropdownMenu module re-renders the graph when selections change.

RRobert Curtis
75% match
Loading thumbnail…

Minimum Wage Scatter Plot

This scatter plot visualizes US minimum wage data by state from 1968 to 2017, sourced from Kaggle, with each point representing a state-year observation. The visualization uses d3.scaleLinear for both axes, d3.axisBottom and d3.axisLeft for gridlines and tick marks, and d3.scaleOrdinal with d3.schemeSpectral to color points by state origin. A color legend with clickable elements filters the data by dimming non-selected categories. The SVG rendering leverages d3.select, data joins, and standard SVG circles.

RRobert Curtis
74% match
Loading thumbnail…

ICE-7 PIE CHART

This interactive donut chart visualizes the distribution of COVID-19 deaths across several US states, with each state's value represented as a proportion of the whole. Built with React and D3 v4, it renders SVG paths using `d3.arc` and `d3.pie` to create the ring, while a hover interaction, implemented with `d3.select` and mouse events, highlights a slice and displays a tooltip with the state name and value. A separate legend built from the same data array lists each category, using `d3.scaleOrdinal` with `d3.schemeCategory10` to assign colors consistently.

SSaiSree0122
73% match
Loading thumbnail…

Scatter plot showing Statewise Minimum Wage

This scatter plot visualizes the minimum wage across U.S. states from 1968 to 2017, with point size and y-axis position encoding the wage value and color mapping to the year. Using the Vega-Lite API with D3.js for data loading, the visualization reads from a CSV file and displays state names via tooltips, while the federal low wage is shown for comparison. The plot also includes custom axis and label styling for improved readability.

Aaishwarya8615
72% match
Loading thumbnail…

All Donut Chart Deaths

This visualization presents five donut charts comparing death statistics across different demographic and cause-based groupings. The data categorizes deaths by firearm, suicide, and alcohol-related causes, with breakdowns by sex and cause type. Each donut chart displays proportional segments using color-coded arcs, constructed with D3’s `arc` function and `d3.v5`, while the React framework manages component rendering as SVG elements. Labels appear outside each arc, and the data originates from a CSV file covering mortality records.

PPeter Maida
72% match
Loading thumbnail…

Intersections

This visualization displays the relationship between U.S. state statistics—including median income, alcohol consumption, and murder rate—using a dynamic scatter plot. The plot transitions between categorical bar charts for states and quantitative scatter plots, with animated circles for numeric comparisons. D3's scaleLinear, scaleBand, axisBottom, and axisLeft APIs handle the chart construction, while the `menu` component and `dispatch` enable interactive axis selection. The code uses `transition` for smooth animations and `selection.join` for efficient SVG element updates. The data comes from a CSV file combining income, alcohol, and murder statistics per state.

Aadventuresenglish.info@gmail.com
72% match
Loading thumbnail…

Scatter Plot of CDC Data with Menus

This data visualization displays a scatter plot of U.S. CDC health data, allowing users to explore relationships between variables like age, weight, and exercise. The chart uses two dropdown menus to select which quantitative or categorical columns map to the x- and y-axes, with points updating via d3's transition API. The implementation leverages d3's scaleLinear and scalePoint for axis scaling, and the selection.join method for incremental rendering of circles and axes. The plot renders as SVG with a 1-second animated transition, using the CDC General Health dataset fetched via CSV.

RRidhima Saxena
72% match