Published
Edited
Oct 18, 2021
1 star
Insert cell
Insert cell
viewof v1 = embed({
$schema: "https://vega.github.io/schema/vega-lite/v5.json",
data: { url: data["movies.json"].url },
mark: "bar",
params: [
{
name: "brush",
select: { type: "interval", encodings: ["x"] }
}
],
encoding: {
x: {
bin: true,
field: "IMDB Rating"
},
y: { aggregate: "count" }
}
})
Insert cell
viewof v2 = embed({
$schema: "https://vega.github.io/schema/vega-lite/v5.json",
data: { url: data["movies.json"].url },
mark: "bar",
transform: [
{
filter:
"brush['IMDB Rating'][0] <= datum['IMDB Rating'] && datum['IMDB Rating'] < brush['IMDB Rating'][1]"
}
],
params: [
{
name: "brush",
value: { "IMDB Rating": [0, 10] }
}
],
encoding: {
x: {
bin: true,
field: "Rotten Tomatoes Rating"
},
y: { aggregate: "count" }
}
})
Insert cell
// send signal updates to another view
v1.addSignalListener("brush", (_, value) => {
v2.signal("brush", value).runAsync();
})
Insert cell
Insert cell
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