Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Visualization Grammar
Search
Eitan Lees
March 03, 2020
Programming
9
740
Visualization Grammar
A brief tour of the Vega/Vega-Lite visualization grammar used in Altair
Eitan Lees
March 03, 2020
Tweet
Share
More Decks by Eitan Lees
See All by Eitan Lees
Visualization
eitanlees
146
16k
Matplotlib
eitanlees
8
860
Altair Tutorial
eitanlees
4
930
Scientific Visualization
eitanlees
6
640
Other Decks in Programming
See All in Programming
The Implementations of Advanced LR Parser Algorithm
junk0612
1
900
Jakarta EE Meets AI
ivargrimstad
0
520
「理解」を重視したAI活用開発
fast_doctor
0
220
サービスクラスのありがたみを発見したときの思い出 #phpcon_odawara
77web
4
700
Bedrock×MCPで社内ブログ執筆文化を育てたい!
har1101
6
1.3k
RuboCop: Modularity and AST Insights
koic
2
2.1k
MCP調べてみました! / Exploring MCP
uhzz
2
2.3k
Contribute to Comunities | React Tokyo Meetup #4 LT
sasagar
0
580
エンジニアが挑む、限界までの越境
nealle
1
290
Exit 8 for SwiftUI
ojun9
0
150
On-the-fly Suggestions of Rewriting Method Deprecations
ohbarye
1
4.2k
By the way Google Cloud Next 2025に行ってみてどうだった
ymd65536
0
110
Featured
See All Featured
Stop Working from a Prison Cell
hatefulcrawdad
268
20k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
680
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Automating Front-end Workflow
addyosmani
1370
200k
Producing Creativity
orderedlist
PRO
344
40k
Embracing the Ebb and Flow
colly
85
4.7k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.7k
[RailsConf 2023] Rails as a piece of cake
palkan
54
5.5k
Making Projects Easy
brettharned
116
6.1k
How to Think Like a Performance Engineer
csswizardry
23
1.5k
Build your cross-platform service in a week with App Engine
jlugia
230
18k
Transcript
Data Mark Encoding Transform Scale Guide Visualization Grammar
Data Mark Encoding Transform Scale Guide A B C &
Variables Observations Tabular Data A B C
Data Mark Encoding Transform Scale Guide A,B,C,D,E 4,6,4,4,3 4,4,8,4,3 7,5,5,0,1
5,9,3,0,5 0,1,2,4,2 [ { "A":4, "B":6, "C":4, "D":4, "E":3 }, { "A":4, "B":4, "C":8, "D":4, "E":3 }, { "A":7, "B":5, "C":5, "D":0, "E":1 }, { "A":5, "B":9, "C":3, "D":0, "E":5 }, { "A":0, "B":1, "C":2, "D":4, "E":2 } ] https://eitanlees.com/ABC.csv
Data Mark Encoding Transform Scale Guide B A A A
C C C B B and many more ... Text Circle Bar Line
Data Mark Encoding Transform Scale Guide X Position Y Position
Size Color ⠇ Channel A B C D ⠇ Variable
Data Mark Encoding Transform Scale Guide Calculate Fold Filter Aggregate
and many more ...
Data Mark Encoding Transform Scale Guide f(domain) → range
Data Mark Encoding Transform Scale Guide A B C Legend
Data Mark Encoding Transform Scale Guide Let’s make a chart
Data Mark Encoding Transform Scale Guide import altair as alt
from vega_datasets import data iris = data.iris() sepalLength sepalWidth PetalLength PetalWidth species 5.1 3.5 1.4 0.2 setosa 4.9 3.0 1.4 0.2 setosa 4.7 3.2 1.3 0.2 setosa 4.6 3.1 1.5 0.2 setosa ⠇
Data Mark Encoding Transform Scale Guide import altair as alt
from vega_datasets import data iris = data.iris() alt.Chart(iris).mark_circle()
Data Mark Encoding Transform Scale Guide import altair as alt
from vega_datasets import data iris = data.iris() alt.Chart(iris).mark_circle() Without an encoding our chart is not very interesting
Data Mark Encoding Transform Scale Guide import altair as alt
from vega_datasets import data iris = data.iris() alt.Chart(iris).mark_circle().encode( alt.X('petalLength'), alt.Y('petalWidth') )
Data Mark Encoding Transform import altair as alt from vega_datasets
import data iris = data.iris() alt.Chart(iris).mark_circle().encode( alt.X('petalLength'), alt.Y('petalWidth'), alt.Color('species') ) Scale Guide
Data Mark Encoding Transform import altair as alt from vega_datasets
import data iris = data.iris() alt.Chart(iris).mark_circle().encode( alt.X('petalLength'), alt.Y('petalWidth'), alt.Color('species') ) Scale Guide Note that the guides and scales are automatically generated for us
Data Mark Encoding Transform import altair as alt from vega_datasets
import data iris = data.iris() alt.Chart(iris).mark_circle().encode( alt.X('petalLength'), alt.Y('petalWidth'), alt.Color('species') ).transform_filter( alt.datum.sepalWidth < 3 ) Scale Guide