Published unlisted
Edited
Jun 11, 2022
Insert cell
Insert cell
cdf_movies = {
const plot = vl.markArea()
.data(movies_data)
.transform(
{
"sort": [{"field": "IMDB Rating"}],
"window": [{"op": "count", "field": "count", "as": "Cumulative Count"}],
"frame": [null, 0]
}
)
.encode(
vl.x().fieldQ('IMDB Rating'),
vl.y().fieldQ('Cumulative Count')
)
return plot.render();
}
Insert cell
mean_acceleration1 = {
const plot = vl.markBar()
.data(cars_data)
.encode(
vl.x()
.field('Cylinders'),
vl.y()
.field('Acceleration')
.aggregate('count')
)
return plot.render();
}
Insert cell
Insert cell
mean_acceleration = {
const plot = vl.markBar()
.data(cars_data)
.encode(
vl.x()
.fieldQ('Cylinders'),
vl.y({"aggregate": "mean", "field": "Acceleration"})
// .fieldQ('Acceleration')
// .aggregate('mean')
)
return plot.render();
}
Insert cell
Insert cell
no_aggregates = {
const plot = vl.markBar()
.data(cars_data)
.encode(
vl.x()
.fieldQ('Cylinders'),
vl.y()
.mean('Acceleration')
)
return plot.render();
}
Insert cell
import {vl} from "@vega/vega-lite-api-v5"
Insert cell
movies_data = datasets['movies.json']();
Insert cell
Insert cell
datasets = require('vega-datasets@2');
Insert cell

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.
Learn more