Fork of Vega-Lite API Template

100%

Fork of Vega-Lite API Template

✓ Published0🌍 Public

Last edited Jan 23, 2022

Created on Jan 23, 2022

This example visualizes the relative populations of religious groups across countries using a bubble chart. Circles are positioned along categorical axes for country and religion, with circle size encoding population magnitude. The visualization is built using the Vega-Lite API, which compiles specifications to Vega and renders with SVG via D3. Data is loaded asynchronously using D3’s `csv` function from a gist. Custom axis styling and a dark label color improve readability, and a tooltip displays the population value when hovering over a circle.

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 Vega-Lite API Template

This example visualizes the global distribution of religious populations by country using a bubble chart. Circle size and tooltip values encode population counts, with countries ordered by total population on the x-axis and religions on the y-axis. The visualization is built with the Vega-Lite API, which programmatically constructs the chart specification, and renders it via the Vega and Vega-Lite libraries. Data is loaded as CSV from a remote gist using D3’s `csv` function, and custom axis styling improves readability.

BBHAVYA0042

95% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example shows the global distribution of religious populations across countries using a bubble chart, where each circle’s size encodes the population count and its position maps country and religion on the axes. The visualization is built with the Vega-Lite API, which registers Vega and Vega-Lite libraries, and it renders as an SVG via the `vl.markCircle` and `vl.encode` functions. Data is loaded asynchronously from a CSV using D3’s `csv` method, and a custom config object adjusts axis styling and font sizes for readability.

AAlexander Dorling

95% match

Loading thumbnail…

Fork of Vega-Lite API Template

This visualization shows the distribution of religious populations across countries using a bubble chart, with circle size encoding population quantity and tooltips revealing exact values. The chart is built with the Vega-Lite API, which wraps Vega and Vega-Lite to generate an SVG rendering. The code imports data from a CSV file using D3's `csv` function, then configures axes, tooltips, and a dark color scheme for readability. The visualization occupies the full viewport and updates its size dynamically based on the window dimensions.

Aafcchilders

95% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example shows a bubble chart of religious populations by country, with circles sized by population and positioned along country and religion axes. It uses the Vega-Lite API (vl) to construct the visualization declaratively, with d3.csv loading data from a GitHub Gist of top five religions per country. The chart renders via Vega’s SVG renderer, incorporates custom axis and label styling from a config object, and enables tooltips through vega-tooltip. The view is sized to fit the window and updates automatically on resize.

Wwindwaver

95% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes global religious affiliations by country using a bubble chart, where bubble size encodes population and axes map countries against religions. Built with the Vega-Lite API, it registers Vega, Vega-Lite, and Vega-Tooltip to render an interactive SVG view. The visualization loads CSV data from a Gist via D3’s `csv` function, configures axis and label styling, and auto-sizes to the window. A tooltip handler displays population values on hover, while the circle marks are encoded with categorical fields for country and religion.

Wwhiteswallow87

95% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes the relative proportions of religious affiliations across countries using a bubble chart, where each bubble’s size encodes population and its position maps country and religion. The visualization is built with the Vega-Lite API, using `vl.markCircle()`, `vl.x()`, `vl.y()`, and `vl.size()` to encode fields, while a tooltip displays population values. Data is loaded asynchronously via `d3.csv` from a remote URL, and the chart renders with d3.v5, Vega, Vega-Lite, and Vega-Tooltip, with custom styling applied through a config object.

Sshimos12468

95% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes the distribution of religious affiliation by country using a bubble chart. Each circle represents a country’s population grouped by religion, with circle size encoding population magnitude. The visualization is built with the Vega-Lite API, registered through Vega and Vega-Lite, and renders using SVG. Data comes from the UCI Machine Learning Repository’s Auto MPG dataset, though the code loads religion and population data via a CSV fetched with d3.csv. Custom axis styling and tooltips are configured through Vega-Lite’s config and the vega-tooltip handler.

Ddiska432

94% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example displays a bubble chart comparing religious affiliations across countries, using circle size to encode population and axes for country and religion. Built with the Vega-Lite API, it registers Vega and Vega-Lite libraries with D3’s CSV loader to fetch data from a GitHub gist. The visualization automatically fills the browser viewport, applies custom axis styling from a config object, and includes a Vega-Tooltip handler for interactive population details on hover.

LLento Manickathan

94% match