Fork of Vega-Lite API Template

100%

Fork of Vega-Lite API Template

✓ Published0🌍 Public

Last edited Mar 16, 2021

Created on Mar 15, 2021

This visualization displays a horizontal bar chart showing population counts by country, with each bar color-coded by religion. The chart is built using the vega-lite-api library, which registers Vega and Vega-Lite to render SVG output. Data is loaded asynchronously via d3.csv from a GitHub Gist containing religion-by-country statistics. The visualization uses quantitative population fields for the y-axis, nominal country fields for the x-axis, and nominal religion fields for color encoding, with tooltips enabled through vega-tooltip.

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 visualization displays the population distribution of major religions across countries using a bar chart, with each bar segmented and colored by religion. It leverages the Vega-Lite API (`vl.markBar`, `vl.x().fieldN('country')`) to encode the data, with tooltips showing population values via `vl.tooltip().fieldN('population')`. The chart reads from a CSV file containing religion-by-country statistics, loaded asynchronously via D3’s `csv` function. Rendering is handled through Vega and Vega-Lite’s JavaScript libraries, with custom styling applied from a configuration object for axis colors and font sizes.

EEevikettu

95% match

Loading thumbnail…

Fork of Vega-Lite API Template Origin

This visualization displays a bar chart of population by country, with colors encoding religion and tooltips revealing population values on hover. It uses the Vega-Lite API to construct the chart, with getData.js loading CSV data from a gist containing religion-by-country statistics. The code leverages vega-lite-api's `markBar`, `x()`, `y()`, `color()`, and `tooltip()` methods, registered with vega and vega-lite, and renders via the SVG view with a vega-tooltip handler. The config customizes axis ticks and font styles for readability.

Ddleoenri

94% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes religious demographics across countries using a bar chart, with each bar representing a country and the color encoding the population for each religion. The visualization is built using the Vega-Lite API and rendered with D3.js, incorporating vega-tooltip for interactive hover details. Data is loaded from a CSV file hosted on GitHub, containing population figures for various religions by country. The chart fills the entire window and uses custom styling to adjust font sizes and axis appearance for readability.

DDipak654

94% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example presents a horizontal bar chart visualizing population by country, with bars colored by religion. The visualization is built programmatically using the Vega-Lite API, which is registered with the Vega and Vega-Lite libraries. The `vl.markBar()` method encodes the country, population, and religion fields, while data is loaded from a CSV file using `d3.csv`. The chart is rendered as an SVG and configured with custom axis and label styles.

KKtuzinowski

94% match

Loading thumbnail…

Fork of Vega-Lite API Template

This visualization presents a bar chart of global religious populations, sorted by country size and colored by religion, with interactive tooltips showing population values. Built using the Vega-Lite API with d3.csv for data loading, the visualization reads from the Auto MPG Data Set via a Gist, though the chart itself displays religion-by-country data. The code configures the chart through vl.markBar(), vl.x(), vl.y(), and vl.color() encodings, while Vega-Lite's renderer generates SVG output within a full-window, dark-themed layout using custom axis and label styling.

OOpe Kareem

94% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example presents a bar chart of population by country, with bars colored by religion, using the Vega-Lite API. It loads CSV data from a GitHub gist via D3’s `csv` function. The chart is rendered with Vega-Lite’s `markBar` encoding x by country, y by population, and color by religion. The visualization is built with `vega-lite-api` and rendered to SVG through Vega, with tooltips provided by `vega-tooltip`.

KKNJour

94% match

Loading thumbnail…

Fork of Vega-Lite API Template

This bar chart shows the population of countries, segmented by religion, with bars sorted in descending order of total population. Built using the Vega-Lite API, the visualization defines the mark, encodings, and tooltip in code, then renders through a Vega view with an SVG renderer. The data is loaded from a CSV file using d3’s `csv` method, and axes are customized via a config object. Interactive tooltips are provided by the vega-tooltip Handler.

HHJQ2000

93% match

Loading thumbnail…

Fork of Vega-Lite API Template

This visualization presents a horizontal bar chart of population by country, with bars colored by religion and sorted in descending order. Built with the Vega-Lite API, it registers Vega and Vega-Lite alongside a tooltip handler via vega-tooltip, rendering as SVG through D3 v5. Data loads from a CSV of population and religion statistics using d3.csv, with axis and label styling customized in a separate config module.

Ttomahawk-jupiter

93% match