import {vl} from '@vega/vega-lite-api'
import {printTable} from '@uwdata/data-utilities'
data = require('vega-datasets') // import vega_datasets
cars = data['cars.json']() // load and parse cars data
printTable(cars.splice(0,5)) // display the first five rows
data['cars.json'].url
md`# Basic Bar Chart`
vl.markBar()
.data(cars)
.encode(
vl.x().average('Miles_per_Gallon'),
vl.y().fieldN('Origin')
)
.render()
vl.markPoint().data(cars).encode(
vl.x().fieldQ('Horsepower'),
vl.y().fieldQ('Miles_per_Gallon'),
vl.color().fieldN('Origin'),
vl.tooltip(['Name', 'Origin', 'Year']) // show the Name and Origin fields in a tooltip
).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.
