HW Add a Menu

100%

✓ Published1🌍 Public

Last edited Nov 8, 2018

Created on Sep 26, 2018

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.

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 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.

WW9183907

94% 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

76% 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

75% 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

75% match

Loading thumbnail…

HW1-Scatter Plot with Menu

This interactive scatter plot visualizes multidimensional data through a menu-driven interface. The visualization uses D3.js to render points on an SVG canvas, with a dropdown menu allowing users to switch between different data attributes for the x and y axes. The code employs d3.select, d3.scaleLinear, d3.axisBottom, and d3.axisLeft to construct the coordinate system, while d3.csv parses the external dataset. A menu change event triggers a transition that updates the point positions using transition.attr, providing a dynamic comparison of variable relationships.

Ee94091071@gs.ncku.edu.tw

74% 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

73% 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

73% match

Loading thumbnail…

HW5: Stacked Bar Charts

This interactive stacked bar chart visualizes university rankings across five weighted performance indicators: Teaching, Research, Citations, Industry Income, and International Outlook. Users can sort universities by overall score or individual metrics in ascending or descending order via dropdown menus. The chart employs React with D3.js v6, using d3.stack() to compose the stacked bars and d3.scaleBand() for the x-axis. An SVG legend provides hover highlighting, adjusting bar opacity to emphasize selected categories while dimming others.

LLSAWB

73% match