<commit_before>---
layout: tutorials
menu: tutorials
title: Create a Visualization of Weather Data
permalink: /tutorials/weather.html
---

** This tutorial is work in progress **

<!--

In this tutorial, you'll learn a few more techniques for creating visualizations in Vega-Lite. If you are not familiar with Vega-Lite, read the [getting started tutorial]({{site.baseurl}}/tutorials/getting_started.html) first.

Let's say you have some dataset about weather data in Seattle, WA that you want to visualize. The [dataset] is a simple CSV file with columns for the temperature, precipitation, wind, and weather type.

* **AWND** - Average daily wind speed (tenths of meters per second)
* **TOBS** - Temperature at the time of observation (tenths of degrees C)
* **TMAX** - Maximum temperature (tenths of degrees C)
* **TMIN** - Minimum temperature (tenths of degrees C)
* **PRCP** - Precipitation (tenths of mm)

* **WT14** - Drizzle
* **WT03** - Thunder
* **WT04** - Ice pellets, sleet, snow pellets, or small hail"
* **WT05** - Hail (may include small hail)
* **WT16** - Rain (may include freezing rain, drizzle, and freezing drizzle)"
* **WT17** - Freezing rain
* **WT18** - Snow, snow pellets, snow grains, or ice crystals
* **WT08** - Smoke or haze
* **WT11** - High or damaging winds
* **WT22** - Ice fog or freezing fog
* **WT01** - Fog, ice fog, or freezing fog (may include heavy fog)
* **WT02** - Heavy fog or heaving freezing fog (not always distinguished from fog)
* **WT13** - Mist

--><commit_msg>Weather tutorial<commit_after>---
layout: tutorials
menu: tutorials
title: Create a Visualization of Weather Data
permalink: /tutorials/weather.html
---

In this tutorial, you'll learn a few more techniques for creating visualizations in Vega-Lite. If you are not familiar with Vega-Lite, read the [getting started tutorial]({{site.baseurl}}/tutorials/getting_started.html) first.

Let's say you have some dataset about weather data in Seattle that you want to visualize. The [dataset]({{site.baseurl}}/data/seattle-weather.csv) is a CSV file with columns for the temperature, precipitation, wind, and weather type.

**TODO**

<div class="vl-example">
{
  "data": {"url": "data/seattle-weather.csv","formatType": "csv"},
  "mark": "line",
  "encoding": {
    "x": {"field": "date","type": "temporal","timeUnit": "month"},
    "y": {
      "field": "precipitation",
      "type": "quantitative",
      "aggregate": "sum"
    }
  }
}
</div>

<div class="vl-example">
{
  "data": {"url": "data/seattle-weather.csv","formatType": "csv"},
  "mark": "line",
  "encoding": {
    "x": {"field": "date","type": "temporal","timeUnit": "yearmonth"},
    "y": {
      "field": "temp_max",
      "type": "quantitative",
      "aggregate": "mean"
    }
  }
}
</div>

<div class="vl-example">
{
  "data": {"url": "data/seattle-weather.csv","formatType": "csv"},
  "mark": "line",
  "encoding": {
    "x": {"field": "date","type": "temporal","timeUnit": "year"},
    "y": {
      "field": "temp_max",
      "type": "quantitative",
      "aggregate": "mean"
    }
  }
}
</div>

<div class="vl-example">
{
  "data": {"url": "data/seattle-weather.csv","formatType": "csv"},
  "transform": {
    "calculate": [
      {
        "field": "temp_range",
        "expr": "datum.temp_max - datum.temp_min"
      }
    ]
  },
  "mark": "line",
  "encoding": {
    "x": {
      "field": "date",
      "type": "temporal",
      "timeUnit": "month"
    },
    "y": {
      "field": "temp_range",
      "type": "quantitative",
      "aggregate": "mean"
    }
  }
}
</div>


<div class="vl-example">
{
  "data": {"url": "data/seattle-weather.csv","formatType": "csv"},
  "mark": "bar",
  "encoding": {
    "x": {"field": "date","type": "temporal","timeUnit": "month"},
    "y": {
      "field": "*",
      "type": "quantitative",
      "aggregate": "count"
    },
    "color": {"field": "weather","type": "ordinal"}
  }
}
</div>

<div class="vl-example">
{
  "data": {"url": "data/seattle-weather.csv","formatType": "csv"},
  "mark": "bar",
  "encoding": {
    "x": {
      "field": "date",
      "type": "temporal",
      "timeUnit": "month",
      "axis": {"title": "Month of the year"}
    },
    "y": {
      "field": "*",
      "type": "quantitative",
      "aggregate": "count"
    },
    "color": {
      "field": "weather",
      "type": "ordinal",
      "scale": {
        "domain": ["sun","fog","drizzle","rain","snow"],
        "range": ["#e7ba52","#c7c7c7","#aec7e8","#1f77b4","#9467bd"]
      }
    }
  }
}
</div>
{'fraction_non_alphanumeric': 0.19915630550621669, 'fraction_numerical': 0.009325044404973356, 'mean_word_length': 3.4296951819075714, 'pattern_counts': {'":': 93, '<': 16, '<?xml version=': 0, '>': 16, 'https://': 0, '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': '4707278', 'n_tokens_mistral': 1621, 'n_tokens_neox': 1522, 'n_words': 438}