<commit_before>---
layout: tutorials
title: Tutorials
permalink: /tutorials/index.html
---

Tutorials for learning how to use Vega.

### [Let's Make a Bar Chart](bar-chart/)

_Skill level: Beginner._ Learn the basic elements of Vega by creating a bar chart with interactive tooltips.

### [A Guide to Guides: Axes &amp; Legends](https://beta.observablehq.com/@jheer/a-guide-to-guides-axes-legends-in-vega)

_Skill level: Intermediate._ Tour the various types of axes and legends in Vega, learn how to parameterize them and adjust their layout.

### [Mapping Airport Connections](airports/)

_Skill level: Intermediate._ Learn more advanced Vega features &ndash; including mapping, data transformation, and interaction &ndash; by building an interactive map of direct routes among major U.S. airports.<commit_msg>Add link to How Vega Works tutorial.<commit_after>---
layout: tutorials
title: Tutorials
permalink: /tutorials/index.html
---

Tutorials for learning how to use Vega.

### [Let's Make a Bar Chart](bar-chart/)

_Skill level: Beginner._ Learn the basic elements of Vega by creating a bar chart with interactive tooltips.

### [A Guide to Guides: Axes &amp; Legends](https://beta.observablehq.com/@jheer/a-guide-to-guides-axes-legends-in-vega)

_Skill level: Intermediate._ Tour the various types of axes and legends in Vega, learn how to parameterize them and adjust their layout.

### [Mapping Airport Connections](airports/)

_Skill level: Intermediate._ Learn more advanced Vega features &ndash; including mapping, data transformation, and interaction &ndash; by building an interactive map of direct routes among major U.S. airports.

### [How Vega Works](https://beta.observablehq.com/@jheer/how-vega-works/)

_Skill level: Advanced._ How a Vega JSON specification becomes an interactive view, covering parsing, dataflow processing, scenegraph construction, and rendering.
{'fraction_non_alphanumeric': 0.09538950715421304, 'fraction_numerical': 0.0, 'mean_word_length': 4.809230769230769, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 3, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5864862', 'n_tokens_mistral': 566, 'n_tokens_neox': 539, 'n_words': 220}