HW Add a Menu

100%

✓ Published0🌍 Public

Last edited May 19, 2020

Created on May 19, 2020

This interactive bar chart visualizes labor data for 16 graduate program categories from 2010–2012, sourced from FiveThirtyEight’s Economic Guide to Picking a College Major. A dropdown menu allows users to switch between metrics such as total graduates, median salary, and unemployment rate, instantly updating the bar heights with a smooth d3 transition. The visualization uses d3.scaleBand, d3.scaleLinear, d3.axisLeft, d3.axisBottom, and d3.csv to load and render the SVG, with the menu built via the custom dropdownMenu function.

AI-generated description

This bar chart displays the basic earnings and labor information for 16 categories of graduate programs between 2010-2012. The data comes from The Economic Guide To Picking A College Major by FiveThirtyEight.

MIT Licensed

Similar vizzes

Loading thumbnail…

HW Add a Menu

This interactive bar chart displays earnings and labor data for 16 graduate program categories, sourced from FiveThirtyEight. A dropdown menu lets the viewer select which metric to display on the y-axis. The visualization uses d3.scaleLinear and d3.scaleBand for scales, with d3.axisLeft and d3.axisBottom for axes. The bars animate via a d3.transition on rect attributes, while the menu is built with a custom dropdownMenu module.

YYF

94% match

Loading thumbnail…

Project prototype 10/17

This interactive scatter plot visualizes earnings and labor force data for college graduates by major, sourced from FiveThirtyEight. Users select X and Y axes from dropdown menus, exploring relationships between variables like median salary and unemployment rate. Circles are colored by major category with a clickable color legend that filters selections. The visualization uses d3.csv, d3.scaleLinear, axis generators, and SVG animations with transitions, rendering interactively within a single-page d3.v5 application.

YYF

77% match

Loading thumbnail…

Project 10/31

A scatter plot uses a dropdown menu to compare different earning and labor force metrics for college majors from FiveThirtyEight data. Colored circles represent major categories, while a clickable legend filters points by STEM status. SVG elements animate into place using D3 transitions. The implementation relies on D3 scales, axes, and selection methods, with tooltips displaying major names on mouseover.

YYF

77% match

Loading thumbnail…

Project 10/31

This interactive scatter plot visualizes earnings and labor force data for college majors, sourced from FiveThirtyEight. The visualization uses D3.js to render SVG circles, with a dropdown menu to select the y-axis variable. A color legend allows filtering by major category, and hovering over points reveals a tooltip. The plot uses animated transitions when data changes, and circles are jittered to reduce overplotting.

KKeerthiKandadai

76% match

Loading thumbnail…

Final Project

This example visualizes labor force information for college graduates, filtering the data by major category and STEM status. The main chart is an animated scatter plot, where the y-axis is categorical and the x-axis is a selected numeric measure. Users can interact by changing the x-axis through a dropdown menu and clicking legend items to filter the data and a supporting table. The visualization is built with D3 v5, using SVG and transitions for the animation. Legend selection triggers an update to the data table, and a tooltip appears on mouseover. The rendering also applies a mix-blend mode to the circles, and the dataset is loaded from a CSV file.

YYF

75% match

Loading thumbnail…

Project 10/31

This scatter plot shows labor force statistics for college graduates across different majors, with each point representing a major and colored by category. Users can switch the y-axis metric via dropdown and click the STEM legend to highlight STEM majors with enlarged, repositioned points. The visualization uses D3 v5 with SVG rendering and animated transitions, pulling data from FiveThirtyEight. Interactive tooltips display major names on hover, while color legends allow filtering by major category and STEM status.

WW9183907

75% match

Loading thumbnail…

Project 10/31

This scatter plot visualizes earnings and labor force statistics for college graduates across different majors, using data from FiveThirtyEight. Users can change the y-axis metric via a dropdown menu, and click legends to filter by major category or STEM status, which animates point positions and opacity. Built with D3 v5, it uses `scalePoint`, `scaleLinear`, and `scaleOrdinal` for scales, plus `transition().delay()` for staggered animations. Circles are colored by major category, with tooltips showing major names on hover.

KKeerthiKandadai

75% match

Loading thumbnail…

Fork of Project 10/31

This scatter plot visualizes earnings and labor force data for college majors, sourced from FiveThirtyEight. It uses d3.scalePoint and d3.scaleLinear for axes, with d3.scaleOrdinal for color encoding by major category and a custom stem legend for STEM classification. A dropdown menu, built with d3, lets users select different y-axis metrics, while clicking legend items filters and highlights points. SVG circles animate with d3.transition, and tooltips display major names, all rendered via d3-selection.

NNarayana Reddy

74% match