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
8
560
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
137
14k
Matplotlib
eitanlees
7
660
Altair Tutorial
eitanlees
3
770
Scientific Visualization
eitanlees
5
440
Other Decks in Programming
See All in Programming
Porting mruby/c for the SNES (Super Famicom) - RubyKaigi 2024
gedorinku
0
490
RubyGems on ruby.wasm
kateinoigakukun
0
160
GNU Makeの使い方 / How to use GNU Make
kaityo256
PRO
13
4.4k
Dev ContainersとTestcontainers
bells17
3
100
Productivity is Messing Around and Having Fun
hollycummins
1
190
The grand strategy of Ruby Parser
yui_knk
5
430
The Final Frontier of Web Development: React Server Components vs Jakarta EE
ivargrimstad
0
200
勉強会4_アップデートされたAssistantsAPIを試す
milky04
0
230
WebGLで始める コンピュータグラフィックス入門
heller77
0
390
Next.js App Router
quramy
14
2.3k
RustでAWS Lambda functionをいい感じに書く
taiki45
2
160
freeeのエンジニアが 就活で出そうな コーディングテストを 解説してみる
freee
1
180
Featured
See All Featured
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
9
1.3k
Fireside Chat
paigeccino
22
2.7k
A Philosophy of Restraint
colly
197
16k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
123
39k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
117
18k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
221
21k
The Cost Of JavaScript in 2023
addyosmani
21
4k
How To Stay Up To Date on Web Technology
chriscoyier
782
250k
Embracing the Ebb and Flow
colly
80
4.2k
Typedesign – Prime Four
hannesfritz
36
2.1k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
34
6.1k
Creatively Recalculating Your Daily Design Routine
revolveconf
211
11k
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