Skip to main content
SimilarExport ZIP
100%

Fork of Vega-Lite API Template

✓ Published0🌍 Public
NNikhilchiguru-8
Last edited Mar 8, 2023
Created on Mar 8, 2023

This scatterplot displays the relationship between engine displacement, horsepower, and weight for various car models, with points colored by model year and labeled with car names via tooltips. It uses the Vega-Lite API with Vega and Vega-Lite libraries, pulling auto-mpg data from a CSV file. The visualization is rendered as an SVG, with custom styling for axis labels and tooltips configured through `config.js`.

AI-generated description

A visualization constructed using the vega-lite-api.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Vega-Lite API Template

This scatter plot displays the relationship between engine displacement and horsepower for a collection of automobiles, with each circle’s area scaled by vehicle weight. The visualization is rendered using the Vega-Lite API, a programmatic wrapper around Vega-Lite and Vega, with tooltips supplied by the vega-tooltip library. Data is loaded as CSV from a remote source using d3.csv, and the plot’s axis styles and dimensions are customized via a configuration object.

NNikhilchiguru-8
95% match
Loading thumbnail…

Fork of Vega-Lite API Template

This scatter plot visualizes the relationship between engine displacement and horsepower for various car models, with tooltips revealing the car's name on hover. Built with the Vega-Lite API, it renders as SVG and automatically fits the browser window. The visualization loads the auto-mpg.csv dataset from a GitHub gist, applies custom axis and label styling, and uses semi-transparent square marks to represent data points, revealing overlapping clusters.

DDeepak Tomson
95% match
Loading thumbnail…

Fork of Vega-Lite API Template

This scatter plot visualizes the relationship between engine displacement and horsepower for a collection of automobiles, using data loaded from a remote CSV file. Each point represents a car model, with tooltips revealing the vehicle's name on hover. The visualization is built using the Vega-Lite API, which constructs a specification rendered through the Vega and Vega-Lite libraries. Data is fetched asynchronously using d3.csv, and the chart configures axis styles and dark guide labels for a polished appearance.

HHarsh Vijay
94% match
Loading thumbnail…

Fork of Vega-Lite API Template

This scatter plot visualizes the relationship between engine displacement, acceleration, and weight for various car models, with color encoding for cylinder count. The visualization is built using the Vega-Lite API, a high-level grammar for declarative graphics, which is registered with the underlying Vega and Vega-Lite rendering engines. Data originates from the UCI Machine Learning Repository's Auto MPG dataset, loaded via d3's csv function. The chart renders as an SVG, and includes interactive tooltips via the Vega-Tooltip library, with custom styling applied through a configuration object.

Pparsonsdjp
94% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes the relationship between engine displacement and horsepower for various car models, using a scatter plot where each point represents a vehicle. The visualization is built with the Vega-Lite API, which generates a Vega-Lite specification that is then rendered as SVG by the Vega library. Data is loaded asynchronously from a CSV file using d3.csv, and the visualization includes interactive tooltips provided by the vega-tooltip Handler. The chart is configured with custom axis styling and font sizes to improve readability.

NNioh
94% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes the relationship between engine displacement, horsepower, and color-coded weight for automobiles from the auto-mpg dataset. It uses the Vega-Lite API to declare a scatterplot with points sized and colored by weight, and includes tooltips showing vehicle names. The visualization is generated through Vega-Lite API’s `vl` object, registered with Vega and Vega-Lite, and renders as an SVG fitted to the window. Data is loaded via `d3.csv`, with customization handled through a config object for axis and label styling.

NNaitik Pitroda
94% match
Loading thumbnail…

Fork of Vega-Lite API Template

This point-based scatter plot visualizes the relationship between engine displacement and horsepower for various automobile models. Built with the Vega-Lite API and rendered through D3, it displays data from a CSV file of auto-mpg statistics, with each point representing a vehicle name revealed via tooltip. The visualization uses a semi-transparent point mark, custom config for axes and labels, and automatically sizes to fit the browser window.

MMuhammad Faizan Khurshid
94% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes the relationship between engine displacement and vehicle weight using a scatter plot of the auto-mpg dataset. The visualization is built with the Vega-Lite API, which registers Vega and Vega-Lite libraries to render an interactive SVG chart. Points are styled with size, opacity, and tooltips showing car names, while the chart automatically fits the window dimensions. Data loading uses D3's `csv` function, and appearance is customized through a reusable configuration object that adjusts axis labels, titles, and tooltip styling.

Llingfa
93% match