Sport Salary - Vega Lite

100%

Sport Salary - Vega Lite

✓ Published0🌍 Public

Last edited Nov 14, 2019

Created on Nov 14, 2019

This visualization displays the salaries of individuals associated with various Swedish ice hockey clubs, including players, coaches, and management personnel. It ranks the top earners by income, from the highest-paid forward to lower-income staff. The data is presented as a bar chart, with each bar representing a person and their position and club identified. The visualization is built using Vega-Lite, leveraging its declarative specification to encode the income values as bar lengths, and directly uses the JSON data structure provided in the source file.

AI-generated description

Similar vizzes

Loading thumbnail…

HR

This bar chart visualizes the average monthly income across HR departments, with department names sorted by descending income on the x-axis and a quantitative income scale on the y-axis. Built with the vega-lite-api library and rendered through vega-lite, the chart pulls CSV data from a GitHub gist. Tooltips are enabled via vega-tooltip, and the visualization is customized with a dark color scheme and increased font sizes for readability.

Qqhfzwyx

67% match

Loading thumbnail…

Vega-Lite API Template

This example displays a scatterplot of ODI player statistics, plotting matches played against runs scored, with point size encoding centuries and tooltips revealing player names. Built with the Vega-Lite API, it uses the `vl.markCircle` and `vl.encode` methods to define the visualization, while D3’s `csv` function loads the dataset from a GitHub gist. The chart fills the entire viewport, applies a custom configuration for axes and fonts, and renders via Vega’s SVG renderer with an interactive tooltip handler.

AAtharvap2000

65% match

Loading thumbnail…

my vega lite

This example shows the evolution of average wages over time for several countries, using a time series line chart. The visualization is rendered in a web page via Vega-Embed, which loads a Vega-Lite specification from an external JSON file. That specification defines the chart’s dimensions and maps the CSV data’s country, year, and average wage fields to visual channels, generating multiple lines. The data is pre-loaded as inline JSON values within the specification, not fetched dynamically from the CSV file.

BBastien Golomer

65% match

Loading thumbnail…

Data Visualization - ICE-6 - Bar chart

This bar chart displays the total revenue, in millions of dollars, of the world’s top 10 highest-earning athletes, with each bar labeled by the athlete’s name along the vertical axis. The visualization uses React to render an SVG and D3’s `scaleBand`, `scaleLinear`, and `csv` to load and map the data from a remote CSV file. Axes are custom-drawn using D3’s `ticks()` method, with manual positioning of tick labels and lines, while the chart itself highlights red bars with blue text and a red axis grid.

SSravan1888

65% match

Loading thumbnail…

reusable roughjs ordinal lollipop

This lollipop chart displays salary, age, and experience for football players in the Swedish Allsvenskan league, with salary on a linear y-axis and years on a categorical x-axis, while circles encode experience using a square-root scale. The visualization uses the Rough.js library to render hand-drawn, sketch-like SVG elements, and D3 v4 for scales, axes, and layout. Data is sorted by year in descending order, with a legend, axis titles, and a subtitle explaining that experience is not the decisive factor.

PPatrick Wojda

64% match

Loading thumbnail…

Welcome to - ICE-6 - Bar chart

This bar chart displays the top 10 highest-earning athletes in the world, with values in millions of dollars, based on a CSV file loaded from a GitHub gist. The visualization uses React with D3 v5, specifically leveraging `scaleBand` for the categorical y-axis, `scaleLinear` for the numeric x-axis, and SVG `rect` elements for the bars. The chart customizes axes through manually drawn tick lines and text labels, with red gridlines and blue tick labels styled via CSS.

AArruSkywalker

64% match

Loading thumbnail…

Vega-Lite API Template

This example visualizes the relationship between TotalWorkingYears and WorkLifeBalance from an HR dataset, with each point representing an employee and tooltips revealing their names. The visualization is built using the Vega-Lite API, which registers with Vega and Vega-Lite to generate an SVG rendering. It loads CSV data via d3.csv, applies custom axis and label styling from a config object, and uses the Vega Tooltip handler for interactive hover information. The chart fits the full browser window with an auto-size setting.

Qqhfzwyx

64% match

Loading thumbnail…

Vega-Lite API Template

A bar chart visualizes historical figures from the Pantheon dataset, comparing their Heritage Price Index (hpi) across ten countries while color-coding by occupation. The visualization filters the raw CSV data to include only mathematicians, statisticians, computer scientists, engineers, inventors, biologists, and physicists from the United States, United Kingdom, Germany, Italy, China, India, Japan, South Korea, Canada, and France. Built with the Vega-Lite API, the chart uses `vl.markBar()` and encodes fields for country, hpi, occupation, and tooltip with figure names. The code loads data via D3's `csv`, applies custom configuration for axis styling, and renders through Vega, Vega-Lite, and vega-tooltip libraries.

Ssriramvsharma

64% match