beerQuery = (await fetch("https://api.punkapi.com/v2/beers?")).json()
beers = beerQuery
table(
beers.slice(0, 7).map(
({ name, tagline, first_brewed, description, image_url }) => ({
Name: md`**${name}**`,
TagLine: md`**${tagline}**`,
Date_Of_First_Brew: md`**${first_brewed}**`,
Description: md`**${description}**`,
Image: html`<img width=70 src="${image_url}" />`,
})
)
)
vl
.markCircle()
.data(beers)
.encode(
vl.y().fieldN('name').sort(null),
vl.x().scale({domain: [50, 105]}).fieldQ('score'),
vl.color().fieldN('type')
)
.render()
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.
