Skip to main content
SimilarExport ZIP
100%

Fork of Fork of Vega-Lite API Template

✓ Published0🌍 Public
Mmuwu16
Last edited Jul 30, 2021
Created on Jul 30, 2021

This visualization displays a scatter plot of automobile data from the UCI Auto MPG dataset, mapping fuel efficiency (mpg) against horsepower. Each point’s size encodes vehicle weight, while color distinguishes the country of origin. The chart uses the vega-lite-api DSL to construct the specification, with vega, vega-lite, and d3.csv handling data loading and rendering. Custom axis styles and tooltips are applied via vega-tooltip, and the view auto-fits to the window using vega’s autosize configuration.

AI-generated description

A visualization constructed using the vega-lite-api.

The data shown here comes from the UCI Machine Learning Repository: Auto MPG Data Set, via Gist: Scatter Plot with Menus.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Vega-Lite API Template

This visualization presents a scatter plot of automobile data from the UCI Machine Learning Repository’s Auto MPG dataset. It positions horsepower on the y-axis and miles per gallon on the x-axis, with points colored by origin and sized by weight, while tooltips reveal vehicle names. Built with the Vega-Lite API, it uses d3.csv for data loading and renders via a Vega view with SVG output. The visualization adapts to the full window size, and custom axis styling is applied through a separate config file.

DDavid Oh
96% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays automobile data from the UCI Machine Learning Repository’s Auto MPG dataset as a scatter plot, showing miles per gallon against horsepower, with color encoding the country of origin and point size representing vehicle weight. The plot uses a dark-themed, large-label aesthetic for clarity. It is built with the Vega-Lite API, which is registered with Vega and Vega-Lite, and uses D3’s `csv` loader to fetch the data. The interactive tooltip is provided by Vega Tooltip, and the chart renders as SVG, fitting the full browser window.

Lleopoldovce2
95% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays the relationship between fuel efficiency (mpg) and horsepower for a set of automobiles, with points colored by origin and sized by weight, using the vega-lite-api to construct a scatter plot. The code loads CSV data from the UCI Auto MPG dataset via d3.csv, then renders the chart with Vega-Lite and Vega, configured with a custom dark theme for improved readability. Hovering over a point reveals the car’s name through a vega-tooltip handler. The visualization fills the entire viewport and uses a fit autosize mode with zero-suppressed scales.

Hhimchan94
95% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example displays a scatter plot of the Auto MPG dataset from the UCI Machine Learning Repository, showing vehicle fuel efficiency against horsepower. Each circle’s size encodes vehicle weight and its color represents the country of origin, with tooltips revealing the car model name. The visualization is built using the Vega-Lite API, which compiles specifications into Vega and renders with D3. Data is fetched as CSV via D3’s `csv` function, and styling customizes axis labels and titles for readability.

Sseitzfab
95% match
Loading thumbnail…

Fork of Vega-Lite API Template 2

This visualization presents an interactive scatter plot of the Auto MPG dataset from the UCI Machine Learning Repository, showing vehicle fuel efficiency against horsepower, with color encoding for country of origin and size encoding for vehicle weight. Built using the Vega-Lite API in conjunction with D3 v5 and Vega-Tooltip, the visualization retrieves data via D3’s CSV loader and renders as a full-window SVG with customized axis styling and tooltips that display vehicle names on hover.

Mmuhammadshumas
95% match
Loading thumbnail…

Fork of Fork of Vega-Lite API Template

This interactive scatter plot visualizes automobile characteristics from the UCI Auto MPG dataset, comparing fuel efficiency (mpg) against horsepower while encoding weight through point size and origin through color. The visualization is built using the Vega-Lite API, which programmatically constructs the specification through chained methods like `markCircle`, `encode`, and field mappings. It imports and registers Vega, Vega-Lite, and Vega-Tooltip libraries, fetches CSV data via `d3.csv`, and renders to SVG with custom styling for axis labels and tooltips.

BBrian Olczak
95% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays a scatter plot of automobile data from the UCI Machine Learning Repository’s Auto MPG dataset, with engine horsepower on the y-axis and miles per gallon on the x-axis. Points vary in color by country of origin and size by vehicle weight, with tooltips revealing car names. The code uses the `vega-lite-api` to build the chart, which registers with Vega and Vega-Lite, while D3’s `csv` loads the data. A custom `config` object adjusts axis and label styling for readability.

Lleongtini
95% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization presents a scatter plot of auto MPG data from the UCI Machine Learning Repository, mapping miles per gallon against horsepower. Each circle’s size encodes vehicle weight, while color distinguishes origin, and hovering reveals the car’s name. The visualization is built using the Vega-Lite API, with d3.csv loading the data and vega-tooltip providing interactive details. The chart fills the browser window, and a custom config adjusts axis and label styling for readability.

SSumit Kumar
95% match