Skip to main content
SimilarExport ZIP
100%

Massachusetts Retention w/ Menu and Interactive Color Legend

✓ Published0🌍 Public
JJerfaas
Last edited Apr 2, 2020
Created on Apr 2, 2020

A scatter plot of Massachusetts school district retention data shows relationships between attendance metrics, where dropdown menus select the X, Y, and circle-size attributes, and an interactive color legend filters data by year. The visualization uses React with D3 v5 scales to map data to SVG circles, which include tooltips displaying X values. Hovering over the color legend dims unrelated years while highlighting the selected one, revealing how retention rates correlate across different school districts and time periods.

AI-generated description

A scatter plot of Massaschusetts School Districts student retention with additional interactive menus and color legend.

The original dataset can be found here. This report presents data on grade retention rates in Massachusetts public schools. The Massachusetts Department of Elementary and Secondary Education defines a student retention as: a student who was reported to have repeated the grade in which he or she was enrolled during the previous school year.

MIT Licensed

Similar vizzes

Loading thumbnail…

Massachusetts Retention w/ Menu and Interactive Color Legend

This scatter plot shows Massachusetts school district retention rates across multiple years, with dropdown menus to change the x-axis, y-axis, and circle-size attributes among attendance and absence metrics. An interactive color legend filters points by year on hover, dimming non-matching circles via opacity. Built with React and D3 v5, it uses `scaleLinear`, `scaleOrdinal`, and SVG circles to render the data from a CSV loaded with `d3.csv`.

EErik Erickson
97% match
Loading thumbnail…

Massachusetts Retention w/ Menu and Color Legend

This interactive scatter plot visualizes Massachusetts school district retention data, with dropdown menus controlling the x-axis, y-axis, and point size, while a color legend encodes the year. Built with React and D3.js, it uses SVG circles to represent districts, with axes generated from D3 scales and color encoded via a sequential ordinal scale. The data is loaded from a CSV file using D3’s `csv` function, and the interface relies on React state to update the chart dynamically.

EErik Erickson
97% match
Loading thumbnail…

Massachusetts Retention compared to Chronically Absent Rates with Menus

This interactive scatter plot shows Massachusetts school district retention rates in relation to chronic absenteeism, with three dropdown menus letting viewers compare different metrics on the x-axis, y-axis, and point size. The visualization uses d3.scaleLinear to map data values to pixel coordinates, with circles rendered as SVG marks whose radius corresponds to a selected attribute. Data is loaded from a CSV via d3.csv, and the React interface updates the axes and circle sizes dynamically when menu selections change, while tooltips display formatted values for each district.

EErik Erickson
88% match
Loading thumbnail…

Massachusetts Retention compared to Chronically Absent Rates

This scatter plot compares Massachusetts school districts’ chronic absenteeism rates on the x-axis with the number of student retentions on the y-axis, while encoding each district’s retention rate through circle radius. The visualization uses React to manage rendering and d3.scaleLinear for all three scales, generating an SVG with custom AxisBottom, AxisLeft, and Marks components. Data comes from the Massachusetts Department of Elementary and Secondary Education, loaded via d3.csv, and styled with opacity and a custom font.

EErik Erickson
83% match
Loading thumbnail…

Massachusetts Rention Rates by year and quartile 10/31/2019 final

This visualization maps Massachusetts school district student retention rates, overlaying circles scaled by quartile value onto a geographic outline of the state. Interactive dropdown menus filter the displayed data by retention quartile and academic year, revealing potential geographic patterns over time. The map renders with `d3.geoAlbers` and `d3.geoPath`, while point radii use `d3.scaleSqrt`. Data from the Massachusetts Department of Elementary and Secondary Education is loaded via `d3.json` and `d3.csv`, and the interface is built with React and `react-dropdown`.

EErik Erickson
83% match
Loading thumbnail…

Interactive Color Legend with Menus

This interactive scatter plot explores the College Dataset, showing relationships between academic metrics like enrollment, admissions, and faculty qualifications. Users dynamically select which attributes appear on the x and y axes using React dropdown menus, while the color legend distinguishes public versus private institutions. Built with React and D3 v5, the visualization uses `scaleLinear` and `scaleOrdinal` for positioning and coloring, rendering as SVG. Hovering over legend items filters the displayed points and fades non-matching data, providing an interactive way to compare institutional characteristics.

AAlaouiadnane
76% match
Loading thumbnail…

Interactive Color Legend with Menus

This interactive scatter plot visualizes the College Dataset, showing relationships between attributes like enrollment numbers and faculty PhD percentages, with points colored by public/private status. Users select X and Y axes from dropdown menus built with ReactDropdown, while hovering over the color legend highlights matching points and fades others. The visualization uses React for component composition, D3 scales for positioning and color mapping, and renders data as SVG circles with axis components from D3.

Yyinhao0424
76% match
Loading thumbnail…

Interactive Color Legend with Menus

This interactive scatter plot visualizes the College Dataset, showing relationships between academic attributes such as applications, enrollment, and faculty credentials. Users select X and Y axes via dropdown menus, while a color legend distinguishes public from private institutions. Hovering over legend items highlights matching points and fades others using React state management. The visualization uses D3 scales and SVG rendering, with React components for axes, marks, and interactive controls, demonstrating a React-D3 integration pattern for exploratory data analysis.

AAlaouiadnane
76% match