Best Colleges: Rank vs Cost

100%

Best Colleges: Rank vs Cost

✓ Published0🌍 Public

Last edited Sep 24, 2020

Created on Sep 17, 2020

Forked from Best Colleges: Cost vs Salary

This example plots 650 colleges from the Forbes Best Colleges 2019 list, with rank on the x-axis and net price on the y-axis, using a circle mark colored by public or private status. It shows that while public schools tend to cost less, there is no strong correlation between rank and price. The visualization is built with the Vega-Lite API, which registers vega and vega-lite, and loads CSV data via d3.csv. Axis labels and titles are customized through a config object, and tooltips display the college name.

AI-generated description

A program that loads and parses some CSV data from the Forbes Best Colleges of 2019 list.

The visualization shows the distribution of colleges plotted by rank along the X axis and net price along the Y Axis. Color indicates the university is either private or public.

It's unsurprising that public schools are generally less expensive, but it is interesting that the cost isn't highly correlated with rank.

MIT Licensed

Similar vizzes

Loading thumbnail…

Best Colleges: Cost vs Salary

This scatterplot displays colleges from the Forbes Best Colleges of 2019 list, plotting net price on the x-axis against alumni salary on the y-axis. Each dot represents a school, with color distinguishing public from private institutions, revealing that private schools cost more but show no clear salary advantage. The visualization is built using Vega-Lite, d3.csv for data loading, and rendered as an SVG via the vega-lite-api, with custom configuration for axis styling and tooltips.

MMartin Blatz

86% match

Loading thumbnail…

Best College: Rank vs Salary

This visualization plots colleges by their Forbes 2019 rank along the x-axis and alumni salary on the y-axis, with color distinguishing public from private institutions. It reveals that top-ranked schools offer higher graduate salaries, with the slope leveling off after the first 50 ranks. The chart is built using Vega-Lite API and D3.js, reading CSV data directly from a GitHub gist. Circles are rendered with a fixed size and slight opacity, while axes are customized through a shared config object to improve readability.

MMartin Blatz

81% match

Loading thumbnail…

Forbes Best Colleges Scatter Plot With Menus

A scatter plot maps Forbes’ 2019 Best Colleges data, plotting schools by two user-selectable attributes chosen from dropdown menus for the X and Y axes. The visualization emphasizes correlations between rank, alumni salary, net price, student population, and total annual cost. Built with React and D3 v5, it uses `scaleLinear`, `extent`, and `csv` to parse and scale the data, rendering SVG circles with tooltips via the `Marks` component. Color differentiates private and public institutions.

MMartin Blatz

76% match

Loading thumbnail…

Vega-Lite API: College Scorecard Price

This visualization shows the relationship between average SAT scores and the net price of public institutions using College Scorecard data. A circular mark plots each institution, with hover tooltips revealing the institution name. The visualization is built with the Vega-Lite API, which registers Vega and Vega-Lite libraries, and uses D3’s `csv` method to load the dataset. The chart is configured with custom axis styling in `config.js` and automatically fits to the full window size.

JJCarpenter-WPI

71% match

Loading thumbnail…

Vega-Lite API: College Scorecard Outcomes

This visualization plots the relationship between entering students' median household income and their earnings six years after enrolling, with each point representing a college or university. The scatterplot uses a circular mark with 50% opacity, revealing overlapping institutions as darker clusters. It relies on the Vega-Lite API, a declarative grammar built atop Vega and Vega-Lite, with data fetched from a CSV hosted as a GitHub Gist. The code configures axis styling, tooltips, and a fit-based autosize using the d3.csv loader.

JJCarpenter-WPI

65% match

Loading thumbnail…

Top 150 US School Data

A scatter plot of the top 150 US schools overlays geographic points onto a map of the United States, encoding each school’s net price through a blue color gradient and its acceptance rate through point size. The visualization layers a GeoJSON map of US states with the school data using the vega-lite-api, pulling location coordinates from the CSV and rendering the map from a Vega US‑10m topology file. It relies on the Albers projection and the vega-lite-api’s `markGeoshape` and `markPoint` marks to combine both datasets in one view.

GGeniXiong

64% match

Loading thumbnail…

Top 150 US School Data

This visualization maps the top 150 US schools by their geographic location, using circle size to represent acceptance rate and color to encode net price. It layers geoshape data from the US 10m TopoJSON API with a point layer positioned via longitude and latitude fields. Built with the Vega-Lite API, it combines the map and scatter plot into a single layered view. The data is loaded from a CSV containing school rankings, with the map rendered using an Albers USA projection.

Mmounika-hub

62% match

Loading thumbnail…

Forbes Top Colleges Data Summary

This visualization displays a simple text summary of the Forbes Top Colleges 2019 dataset, reporting the file size, row count, and column count after loading a remote CSV. It uses D3 v5’s `d3.csv` method to fetch and parse the data from a GitHub gist, then formats the numbers with `d3.csvFormat` and updates a `<pre>` element. The code also includes commented-out alternatives using the Fetch API with `async`/`await` and nested promises, illustrating different asynchronous loading patterns. No charts or graphical encodings are rendered.

MMartin Blatz

62% match