Vega-Lite API Template TESTFork

100%

Vega-Lite API Template TESTFork

✓ Published0🌍 Public

Last edited Aug 28, 2021

Created on Aug 28, 2021

A bubble chart shows the population of various religious groups across countries, with circle size encoding population and position mapping country and religion. Built with the Vega-Lite API, the visualization loads CSV data from a gist URL and renders as a scalable SVG that fits the browser window. The example demonstrates the `vl.markCircle` method with encoded fields for country, religion, and population, styled through a custom config that adjusts axis and label appearance. It integrates Vega-Lite, Vega, and D3’s CSV loader for data ingestion.

AI-generated description

A visualization constructed using the vega-lite-api.

MIT Licensed

Similar vizzes

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

93% match

Loading thumbnail…

Vega-Lite API Template

A bubble chart displays the population of each religion across countries, with circle size encoding population and color distinguishing religions. Built with the Vega-Lite API, the visualization uses `vl.markCircle` and encodings for `x` (country), `y` (religion), `size`, and `tooltip`. Data is loaded via D3’s `csv` from a GitHub gist, and the chart renders through Vega and Vega-Lite with a custom config for styling.

MMosheAron

93% match

Loading thumbnail…

Fork of Vega-Lite API Template

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.

Ccoltonjcox92

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

92% match

Loading thumbnail…

Vega-Lite API Template

This example displays a bubble chart of religious populations by country, with circle size encoding population and axes for country and religion. It uses the Vega-Lite API to construct the visualization declaratively, with the `vl.markCircle()` and `vl.encode()` methods. The chart renders via the Vega rendering engine with SVG output, and data is loaded from a CSV file using D3's `d3.csv()`. The `autosize({ type: 'fit' })` setting makes the chart responsive to the window.

LLucyI

92% match

Loading thumbnail…

Vega-Lite API Template

This example visualizes the relative population sizes of religious groups across countries using a bubble chart, where circle size encodes population and the axes list countries and religions. The visualization is built with the Vega-Lite API, which registers Vega and Vega-Lite libraries, and uses D3’s `csv` loader to fetch data from a Gist derived from the UCI Auto MPG dataset. It applies a custom dark-themed configuration for axes and labels, and renders as a responsive SVG that fits the window, with tooltips enabled through `vega-tooltip`.

BBen Seebeck

92% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example uses the Vega-Lite API to create a bubble chart showing the population of each religion across countries, with circular marks sized by population and colored by country. The visualization loads CSV data from a GitHub gist, renders with SVG via Vega, and includes tooltips for inspecting values. The code configures axes, labels, and styling for readability, while the chart automatically fits the window dimensions. It leverages D3 for data fetching, Vega for rendering, and Vega-Lite’s declarative encoding for marks and scales.

Jjbruzzo

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

91% match