Skip to main content
SimilarExport ZIP
100%

Fork of Vega-Lite API Template3

✓ Published1🌍 Public
AArookie-2020
Last edited Jul 17, 2021
Created on Jul 17, 2021

This visualization shows a bar chart of population by country, sorted in descending order, with tooltips displaying the raw population values on hover. It uses the Vega-Lite API to define the chart specification, while D3.js loads the CSV data from a Gist. The rendering pipeline combines Vega, Vega-Lite, and Vega-Lite API libraries, with Vega-Tooltip for interactive hover details. The chart is configured to fit the full browser window and uses custom axis styling for improved readability. Data originates from the UCI Machine Learning Repository’s Auto MPG dataset.

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 Template4

This visualization displays a bar chart of population by country, with bars colored by religion and tooltips showing population values on hover. The data comes from the UCI Auto MPG dataset via a Gist, though the shown attributes reference country and religion. Built with Vega-Lite API, it registers Vega and Vega-Lite libraries, loads CSV data using d3.csv, and renders the chart as SVG with custom axis and label styling from a config object. The visualization auto-fits to the window size and includes a Vega Tooltip handler for interactive detail viewing.

AArookie-2020
93% match
Loading thumbnail…

Fork of Vega-Lite API Template

The chart displays the population of each country as horizontal bars, sorted in descending order, with tooltips revealing the exact population value on hover. Built using the Vega-Lite API within a D3.js framework, the visualization is rendered as an SVG and dynamically sized to fit the browser window. The code fetches a CSV dataset from a GitHub gist and applies custom styling to axes and guide labels for improved readability.

Hhimchan94
92% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example shows a bar chart of population by country for 2015, with bars sorted in ascending order and tooltips displaying population values on hover. It is built using the Vega-Lite API, which registers Vega and Vega-Lite libraries to create the visualization programmatically. The code loads CSV data via d3.csv and renders the chart as an SVG, applying a custom configuration for axis styling and label fonts. The visualization is designed to fit the full browser window using an autosize fit option.

AAnibal Gatica
92% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example shows a horizontal bar chart of population by country, with bars sorted in descending order and tooltips displaying population values on hover. Built using the Vega-Lite API, it loads CSV data from an external URL via d3.csv, configures visual styling through a custom config object, and renders the chart as an SVG using vega and vega-lite. The chart resizes to fit the window with automatic width and height calculations, and tooltips are enabled through the vega-tooltip Handler.

Ssimontoblad
91% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example displays a bar chart of population by country, colored by religion, with a tooltip showing temperature on hover. The visualization is built using the Vega-Lite API, which wraps Vega and Vega-Lite specifications, and renders to SVG. Data is loaded asynchronously from a CSV file via D3’s `csv` function, sourced from the auto-mpg dataset. The chart is configured with custom axis and label styling, and fills the full viewport using automatic resizing.

AasafJortilles
91% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example shows a bar chart of population by country for 2015, with tooltips displaying the population values. The visualization is built using the Vega-Lite API, which programmatically defines a markBar encoding with a categorical x-axis sorted by value and a quantitative y-axis. Data is loaded asynchronously via d3.csv from a Gist-hosted CSV file, and the chart is rendered as SVG through the Vega runtime. The code customizes axis and label styling via a config object and fits the chart to the browser window dimensions.

DDavid Beales
90% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example shows a bar chart of population by country, with bars colored by religion and tooltips displaying population values on hover. The visualization is built using the Vega-Lite API, which registers Vega and Vega-Lite libraries and uses a custom configuration to adjust axis and label styling for readability. Data is loaded asynchronously from a CSV file via `d3.csv`, and the chart is rendered as SVG with an autosized fit to the window. The code also integrates the Vega Tooltip handler for interactive hover details.

GGerasimos Katsagannis
90% match
Loading thumbnail…

Fork of Vega-Lite API

This example uses the Vega-Lite API to render a bar chart of population by country, with data loaded from a CSV file. The visualization encodes country names on the x-axis and population values on the y-axis, sorting bars by population size. The page imports Vega, Vega-Lite, and Vega-Lite API libraries, registers them together with Vega Tooltip for interactive hover details. Custom axis styling and font sizes from a config object improve readability, while the chart resizes to fit the window using the view’s width and height properties.

LLaura Jackson
90% match