HIVPatientRisk

100%

HIVPatientRisk

✓ Published0🌍 Public

Last edited Aug 18, 2021

Created on Aug 18, 2021

This visualization displays automotive engine displacement and horsepower relationships using a scatterplot, with each point representing a vehicle model. The plot uses low opacity and large point sizes to reveal density clusters in the data. Built with Vega-Lite API, the visualization loads data via `d3.csv` from an external URL, with custom configuration for axis styling and tooltips. The rendering pipeline combines Vega, Vega-Lite, and D3.js through the `vega-lite-api` library, producing an interactive SVG view with hover tooltips showing vehicle names.

AI-generated description

A visualization constructed using the vega-lite-api.

MIT Licensed

Similar vizzes

Loading thumbnail…

scatter_plot

This scatter plot visualizes the relationship between engine displacement and horsepower for a collection of automobiles, with each point representing a vehicle model. The visualization is built using the Vega-Lite API, which registers with Vega and Vega-Lite to render the chart as SVG. Data is loaded asynchronously from a CSV file using D3’s `csv` method, and the plot applies a config for custom axis and label styling. Tooltips, enabled via the vega-tooltip handler, display each car’s name on hover, while point opacity and size convey density across the dataset.

Ggoldpot

83% match

Loading thumbnail…

Vega-Lite API Template

This example visualizes the relationship between engine displacement and horsepower using a scatter plot of vehicle data. The visualization employs a Vega-Lite specification constructed programmatically via the vega-lite-api library, with data loaded from a CSV file using d3.csv. The chart renders as a single SVG element sized to fit the viewport, with points colored by opacity to reveal density. Axis styling and font sizes are customized through a Vega-Lite configuration object, while tooltips are enabled through vega-tooltip.

GGnav3852

82% match

Loading thumbnail…

Vega-Lite API Template

This visualization displays the relationship between engine displacement and horsepower for a collection of automobiles, with each point representing an individual car model. The data is loaded from a CSV file using the d3 `csv` function and rendered as a scatter plot using the Vega-Lite API. The visualization uses `vl.markPoint` with encoded x and y fields, and includes interactive tooltips showing the car name via the `vega-tooltip` Handler. The plot is configured to fit the browser window using `autosize` and applies custom axis and label styling from the config file.

RRohit Krishnan

82% match

Loading thumbnail…

scatter_plot

This scatter plot visualizes the relationship between engine displacement and horsepower for a collection of automobiles, with each point representing a vehicle and its name available via tooltip. The visualization uses the vega-lite-api library to define the chart, which is rendered through Vega-Lite’s SVG backend, and pulls data from a CSV file using d3.csv. The plot is configured with custom axis styling and a dark color scheme, while points are rendered with a subtle opacity to reveal density in overlapping regions.

SsunilthkGmail

82% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes the relationship between engine displacement and horsepower across a dataset of automobiles from the auto-mpg CSV file. Each point represents a car, with opacity and size encoding density, and tooltips reveal the vehicle name. The visualization uses the Vega-Lite API to construct the scatter plot, built on Vega and Vega-Lite, with D3.js handling CSV loading. The rendering uses configurable axis styling and a dark color scheme for improved readability.

Aalfredwang0707

82% match

Loading thumbnail…

Vega-Lite API Template

This example demonstrates a scatter plot of automobile data, showing the relationship between engine displacement and horsepower, with each point representing a car model. The visualization is built using the Vega-Lite API, which constructs a specification that is then compiled and rendered by Vega and Vega-Lite. Data is loaded asynchronously from a CSV file via `d3.csv`, and the plot is configured with custom axis styles and tooltips via the `vega-tooltip` Handler. The chart fills the browser window and uses an interactive SVG renderer.

Ddreesmpk

81% match

Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays a scatterplot of automobile data, plotting horsepower against displacement for individual car models. Each point is rendered as a semi-transparent circle, with tooltips revealing the vehicle name on hover. The visualization is built using the Vega-Lite API, which registers with Vega and Vega-Lite to compile specifications and render SVG output. Data is loaded asynchronously from a remote CSV file using d3.csv, while the vega-tooltip Handler enables interactive tooltips. The chart dynamically fits its dimensions to the browser window through an autosize configuration.

Ggayatrisridhar

81% 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

81% match