Fork of Vega-Lite API Template

100%

Fork of Vega-Lite API Template

✓ Published0🌍 Public

Last edited May 10, 2023

Created on May 10, 2023

This visualization uses Vega-Lite API to plot a scatterplot of college football team data, mapping four-year average recruiting points on the x-axis and average points per game on the y-axis. Circle size encodes scoring average, and tooltips reveal team names. It loads CSV data from a GitHub gist via d3.csv, configures chart appearance in a separate config object, and renders interactively with vega-tooltip. The Vega-Lite chart is built programmatically through vl.markPoint, vl.x, vl.y, and vl.r encodings, then rendered as SVG.

AI-generated description

A visualization constructed using the vega-lite-api.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Vega-Lite API Template

This example uses the Vega-Lite API to render an interactive scatter plot of college football data sourced from a CSV file. Each circle plots a coordinator’s average recruiting points against their average points per game, with circle size encoding opponent points allowed and color distinguishing coordinators. The visualization reads data via d3.csv, configures axes and tooltips through vega-lite-api, and renders with a custom dark theme. Hover tooltips reveal the coordinator name using Vega Tooltip.

BBenLeathers

92% match

Loading thumbnail…

Fork of Vega-Lite API Template

This fork of the Vega-Lite API template displays a scatter plot of MLB team batting data, with each circle representing a team and positioned by its XBA value. The visualization uses the Vega-Lite API with D3 to fetch CSV data from a GitHub Gist, and uses Vega Tooltip for interactive hover details. The chart is configured with custom axis styling and font sizes, and the circular marks are colored by team name with opacity for readability.

GGregS1290

86% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example uses the Vega-Lite API to render a scatterplot of automotive data from a CSV, mapping engine displacement and horsepower onto the x- and y-axes, with color encoding by origin and point size representing miles per gallon. It loads the data via `d3.csv` and builds the visualization with `vl.markPoint`, `vl.x`, `vl.y`, and other encoding functions, then renders to SVG using Vega and Vega-Lite, with a custom tooltip handler and configuration for improved readability.

AAnHaiTrinh

84% match

Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays a scatter plot of student data, plotting marks against time spent studying, with color and size encoding the number of courses and an integer attribute, respectively. The tooltip reveals each student’s name. Built with Vega-Lite API and D3, it loads CSV data from the UCI Auto MPG dataset, renders an SVG via Vega, and customizes axes and label styling through a config object.

NNaimisha-M

84% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example uses the Vega-Lite API with D3 to render a scatterplot of automobile data from a CSV file. The visualization encodes origin as the x-axis, horsepower as the y-axis, weight as color, and mpg as point size, with tooltips showing car names. It applies custom axis and label styling via the Vega-Lite config, and uses the vega-tooltip handler for interactive hover details. The chart is rendered as an SVG that fits the full window using the vega-lite-api’s `render()` method.

Llatifiss

83% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example uses the Vega-Lite API to render a scatter plot of Auto MPG data from the UCI Machine Learning Repository, sourced via a Gist CSV. The visualization encodes miles per gallon on the x-axis, horsepower on the y-axis, colors points by origin, scales size by weight, and adds tooltips for vehicle names. It registers Vega, Vega-Lite, and the vega-lite-api library, then loads the data with d3.csv, applies a custom dark-themed config for axis styling, and fits the chart to the window dimensions.

SShaneBowen1

83% match

Loading thumbnail…

Fork of Fork of Vega-Lite API Template

This visualization displays a scatter plot of data from the UCI Auto MPG dataset, plotting intensity against end year and coloring points by pestle, with tooltips showing sector information. Built with the Vega-Lite API, it uses d3’s `csv` function to load remote data, `vl.markCircle` for the marks, and encodes x, y, color, and tooltip channels. The code registers Vega-Lite with a custom config to adjust axis styling and label fonts, and renders the chart as an SVG fitted to the window size.

KKIRRAN P L

83% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example demonstrates an interactive scatterplot visualization built with the Vega-Lite API, plotting work class and gender attributes from a CSV dataset loaded via d3.csv. The points are rendered with low opacity and large size to show density distributions, with tooltips displaying gender values on hover. The code registers Vega-Lite with the vega and vegaLite libraries, configures an SVG renderer with custom axis styling, and uses the vega-tooltip Handler for interactive feedback. The visualization fills the window and adapts its dimensions dynamically.

Mmarkbayley

83% match