birthdataraw = FileAttachment("birthsraw.csv").csv()
birthdatatidied = FileAttachment("birthscore.csv").csv()
printTable(birthdatatidied.slice(0, 5))
birthdata1 = FileAttachment("birthdata@2.json").json()
printTable(birthdata1.slice(0, 5))
birthdatacondensed = FileAttachment("birthdatacondensed.json").json()
printTable(birthdatacondensed.slice(0, 5))
vl
.markBar()
.data(birthdata1) // Using the birth data
.encode(vl.x().field("Year"), vl.y().fieldQ("United_Kingdom"))
.render()
vl
.markLine()
.data(birthdata1) // Using the tidied json data
.encode(vl.x().field("Year"), vl.y().fieldQ("United_Kingdom"))
.render()
vl
.markPoint()
.data(birthdatatidied) // Using the csv data
.encode(vl.x().field("Year"), vl.y().fieldQ("United Kingdom"))
.render()
vl
.markBar()
.data(birthdatacondensed) // Using the condensed data
.encode(
vl.x().fieldT("Year"),
vl.y().fieldQ("Births"),
vl.column().fieldN("Country"),
vl.tooltip(["Year", "Births"])
)
.render()
vl
.markBar()
.data(birthdatacondensed) // Using the condensed data
.encode(
vl.x().fieldT("Year"),
vl.y().fieldQ("Births"),
vl.color().fieldN("Country"),
vl.tooltip(["Year", "Births"])
)
.render()
vl
.markPoint({ filled: true })
.data(birthdatacondensed)
.encode(
vl.x().fieldT('Year'),
vl.y().fieldQ('Births'),
vl.color().fieldN('Country')
)
.render()
md`
Trying out one more chart as an exploration of the data set.
`
vl
.markRect({ filled: false })
.data(birthdatacondensed)
.encode(
vl.x().fieldO('Country'),
vl.y().fieldQ('Births'),
vl.tooltip(["Year", "Births"])
)
.render()
import { vl } from "@vega/vega-lite-api"
import { printTable } from '@uwdata/data-utilities'
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
