Skip to main content
SimilarExport ZIP
100%

Vega-Lite API Template

✓ Published0🌍 Public
MMosheAron
Last edited Mar 3, 2021
Created on Mar 2, 2021

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.

AI-generated description

A visualization constructed using the vega-lite-api.

MIT Licensed

Similar vizzes

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

Vega-Lite API Template

This visualization displays the population distribution of five countries across religions using a bubble chart. It is built with the vega-lite-api, which registers vega, vega-lite, and vega-tooltip to render the chart as SVG. The data is loaded asynchronously via d3.csv from a Gist URL, with each bubble’s size mapping to the population field. The chart fills the browser window and uses the vega-lite API’s markCircle method with encoded x and y fields for country and religion.

CCurran Kelleher
93% match
Loading thumbnail…

Vega-Lite API Template - bubble chart

A bubble chart displays the population of five religions across multiple countries, with circle size encoding population values and axes categorizing by country and religion. Built with the Vega-Lite API, it registers Vega and Vega-Lite, loads CSV data via d3.csv, and renders an SVG view with tooltips from vega-tooltip. Configuration customizes axis fonts and tick colors for readability, while the chart auto-fits to the browser window.

Llaplantalaplanta
93% match
Loading thumbnail…

Vega-Lite API Template

This example visualizes the world’s most populous religions by country using a bubble chart, where each circle’s size encodes the population count. Hovering reveals the exact population via tooltips. Built with the Vega-Lite API, it registers Vega and Vega-Lite, fetches CSV data from a GitHub gist using D3’s `csv` method, and applies custom axis and font styling from a separate config module. The chart fills the browser window and renders as SVG.

Jjiro2017
93% match
Loading thumbnail…

Vega-Lite API

This example uses the Vega-Lite API to render a bubble chart of religious demographics by country, showing the relative population sizes of the top five religions per nation. The visualization encodes country on the x-axis, religion on the y-axis, and population as the size of each circle, with tooltips displaying the exact population values. The code loads CSV data from a remote URL using d3.csv, then constructs the chart through the Vega-Lite API’s markCircle and encode methods. It integrates Vega, Vega-Lite, and the vega-tooltip handler, with appearance customized via a config object that adjusts axis labels and title fonts.

Ee-ines
93% match
Loading thumbnail…

Vega-Lite API Template TESTFork

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.

PPaul B
93% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays a bubble chart of religious populations by country, where each bubble’s size encodes the population value and its color distinguishes countries. The chart is built with Vega-Lite’s API (via `vega-lite-api`), using `markCircle` and encodings for x-axis country, y-axis religion, and quantitative size. Data is loaded asynchronously from a CSV using `d3.csv`, and the rendered SVG includes an interactive tooltip handler from `vega-tooltip`. The layout auto-fits the window dimensions.

MMatias Conde
93% 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