Skip to main content
100%

Histograma VEGA-lite

✓ Published0🌍 Public
Aaaizemberg
Last edited Sep 10, 2019
Created on Sep 10, 2019

This example displays a histogram of graduation grade averages, showing the distribution of graduate counts across binned "nota" values. The visualization loads tab-separated data from a GitHub-hosted TSV file and renders it as a bar chart using Vega-Lite’s declarative specification, with the x-axis binned and the y-axis aggregated as a count. The code embeds the chart via `vegaEmbed`, relying on Vega 5, Vega-Lite 4, and the `vega-embed` library.

AI-generated description

Similar vizzes

Loading thumbnail…

Strip Plot VEGA-lite

This example shows the distribution of grade point averages for university graduates, with each tick mark representing one student’s promedio plotted along a quantitative x-axis and grouped by degree title on an ordinal y-axis. The visualization is built using Vega-Lite 4.0, embedded via vega-embed 5.1.2, and renders a strip plot with the `mark: "tick"` encoding. Data is loaded from a remote TSV file hosted on GitHub, and the specification is defined in a JavaScript object passed directly to `vegaEmbed`.

Aaaizemberg
83% match
Loading thumbnail…

Vega-Lite API Template

This example visualizes the sum of slum households per division using a bar chart generated with the Vega-Lite API. It renders bars sized to five pixels, sorted by aggregate value, and applies a custom dark-color configuration for axis labels and titles. The code loads CSV data from a GitHub gist using d3.csv, registers vega, vega-lite, and vega-lite-api, and enables tooltips via vega-tooltip’s Handler.

Ssofia-martinovich
72% match
Loading thumbnail…

Vega(Lite)

This example shows a horizontal bar chart of six test data points (element 1 through 6 with values 4, 8, 15, 16, 23, and 42), with the bars extending rightward from the y-axis. The visualization is built using Vega-Lite’s JSON declarative grammar, embedded inline in the page. The chart renders as an SVG via `vegaEmbed`, and the code loads Vega, Vega-Lite, and Vega-Embed from CDNs, then enhances the chart with tooltips using `vegaTooltip.vegaLite` on mouseover.

EEleonore9
71% match
Loading thumbnail…

Vega-Lite Bl.ocks example

This example demonstrates a simple bar chart of categorical values with quantitative measurements, using embedded data for nine lettered categories. The visualization is rendered through Vega-Lite, a high-level grammar for declarative visualization, which is configured via a JSON specification that defines the bar marks and encodings for the x-axis (ordinal) and y-axis (quantitative) fields. The code loads Vega, Vega-Lite, and Vega-Embed from a CDN, then invokes `vegaEmbed` to render the chart into the page, with tooltips enabled for the quantitative values. The chart is specified both as an external JSON file reference and an inline object, showing flexibility in how Vega-Lite specifications can be supplied.

AAlainRo
71% match
Loading thumbnail…

Vega-Lite Bar Chart

This example embeds a Vega-Lite specification into a webpage using the vegaEmbed API, rendering an interactive bar chart of precipitation counts from Seattle weather data. The chart uses a binned x-axis for precipitation values and a y-axis showing aggregate counts, with the data pulled directly from a GitHub-hosted CSV file. The code loads Vega, Vega-Lite, and Vega-Embed libraries from a CDN, and the mark type is set to `bar`. A separate JSON file defines a point chart with nominal and quantitative encodings, but the index.html file demonstrates the primary bar chart visualization.

MMarmiya
70% match
Loading thumbnail…

Vega-Lite API Template

This example renders an interactive bar chart of population by country for 2015, using data from a Gist CSV file. It visualizes the rank-ordered values with a dark theme and custom axis styling. The visualization is built with the Vega-Lite API, which composes specifications programmatically in JavaScript, integrated with Vega and Vega-Lite libraries. It also uses D3’s `csv` loader for data ingestion, and Vega Tooltip for hover interactions, with the chart fitted to the full viewport.

TTengHoo3
70% match
Loading thumbnail…

Vega block example

This example shows a simple bar chart of categorical values labeled A through H, with the bar height encoding the amount for each category. It uses a tooltip to display the amount value when hovering over a bar, and the text labels fade out for the hovered bar to avoid overlap. The visualization is built with Vega, a declarative visualization grammar, and rendered using the Vega-Embed API. The code defines scales for the x and y axes, uses rectangular marks for the bars, and includes a text mark for labels. The data is embedded directly in the specification.

AAlainRo
70% match
Loading thumbnail…

Goodreads book rating histogram

A histogram displays the distribution of average ratings among Goodreads books with more than 1,000 ratings, using data sourced from Kaggle. The chart aggregates ratings into bins along the x-axis while the y-axis counts books per bin. Built with the vega-lite-api, it uses `vl.markBar` with a binned quantitative field and a count aggregation, styled through a custom config. Data is loaded via `d3.csv` and filtered, then rendered with Vega-Lite’s SVG output.

JJacklyn Turner
70% match