Skip to main content
SimilarExport ZIP
100%

Fork of Vega-Lite API Template

✓ Published0🌍 Public
PPoojaGadara
Last edited Feb 22, 2023
Created on Feb 22, 2023

This visualization displays the relationship between engine displacement and horsepower for a dataset of automobiles, with tooltips revealing model names. It uses the Vega-Lite API to define a scatter plot with a single mark type and encoding, while data is loaded asynchronously from a CSV file via D3’s `csv` function. The chart is rendered with SVG and configured with custom axis and label styling. The code also integrates Vega Tooltip for interactive hover details.

AI-generated description

A visualization constructed using the vega-lite-api.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Vega-Lite API Template

This visualization uses a scatter plot to explore the relationship between engine displacement and horsepower in a dataset of automobiles, with tooltips revealing the model name of each point. Built with the Vega-Lite API and Vega-Lite 4.0, it renders points as semi-transparent circles with a custom dark theme and large axis labels. The code loads data from a CSV file via D3’s `csv` method, configures the chart through Vega-Lite’s JavaScript API, and uses Vega Tooltip for interactive hover details.

JJaswitha09
96% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays the relationship between engine displacement and horsepower for a collection of automobiles, with tooltips revealing the model name for each point. It uses the Vega-Lite API to declaratively define the scatter plot, with D3.js (d3.csv) loading the auto-mpg dataset from a GitHub gist. The code registers Vega, Vega-Lite, and Vega-Tooltip, and renders the chart as SVG, adjusting the view to fit the window size.

GGregS1290
96% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays the relationship between engine displacement and horsepower for a sample of automobiles, with interactivity through tooltips that reveal the car model name on hover. Built with the Vega-Lite API, it constructs a scatter plot using semi-transparent points and custom axes. Data is loaded asynchronously via D3’s `csv` function from an external Auto MPG dataset. The code integrates Vega, Vega-Lite, and Vega-Lite API for rendering, while Vega-Tooltip provides hover information.

BBruno Simoes
96% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes the relationship between engine displacement and horsepower for a set of automobiles, with tooltips revealing the vehicle name for each point. The scatter plot is constructed using the Vega-Lite API, which is registered with Vega and Vega-Lite, and rendered as SVG. Data is loaded from a CSV file using D3’s `csv` function, while the visualization’s appearance is customized through a configuration object that adjusts axis styles and font sizes. The chart fills the entire viewport and uses semi-transparent points to reveal overlapping data.

SSarah Elkeurti
95% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes the relationship between engine displacement and horsepower for a dataset of automobiles, with each point representing a car model. The plot uses a scatterplot with tooltips displaying the car name, rendered as a full-screen SVG. Built using the Vega-Lite API, the code leverages `vega`, `vega-lite`, and `vega-lite-api` libraries while fetching data from a CSV via `d3.csv`. The visualization is configured with custom axis styling and an interactive tooltip handler for enhanced readability.

Aaniosindustries
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
95% match
Loading thumbnail…

Fork of Vega-Lite API Template

This scatter plot visualizes the relationship between engine displacement and horsepower for a dataset of automobiles, with tooltips revealing the car name. Built with the Vega-Lite API, the visualization registers Vega and Vega-Lite, loads data from a CSV file via d3.csv, and renders as an SVG. The chart uses markPoint encoding with scaled axes and opacity to handle overlapping points, while the configuration customizes axis appearance and font styling.

MMohamed Ali
95% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays the relationship between engine displacement and horsepower for various automobile models, using a scatter plot where each point represents a car with its name available via tooltip. The plot uses semi-transparent points to reveal overlapping data density, with both axes scaled to start at zero-offset values. Built with the Vega-Lite API, it loads automobile data from a CSV file hosted on GitHub, applies custom styling for readability, and renders interactively with Vega-Tooltip support. The visualization dynamically fits its size to the browser window.

SSabbir
95% match