Public
Edited
Jul 7, 2023
Insert cell
Insert cell
Insert cell
import { vl } from "@vega/vega-lite-api"
Insert cell
// about viewof https://observablehq.com/@observablehq/a-brief-introduction-to-viewof
viewof simpleScatter = vl
.markCircle({ tooltip: true, fillOpacity: 0.8 }) // Make a bar chart
.data(points) // Using the alphabet data
.encode(
vl.x().fieldQ("x"), // .sort(vl.fieldQ("frequency").order("descending")), // Letters are ordinal on the x-axis
vl.y().fieldQ("y"),
vl.color().fieldN("label").scale({ scheme: "set2" }) // Frequency on the y-axis, formatted as percent
)
.width(860)
.height(860)
.render()
Insert cell
viewof repeatedLatent = vl
.markCircle({ tooltip: true, fillOpacity: 0.3 })
.data(points)
.encode(
vl.x().fieldQ("x"), // .sort(vl.fieldQ("frequency").order("descending")), // Letters are ordinal on the x-axis
vl.y().fieldQ("y"),
vl.color().fieldN("label").scale({ scheme: "set2" })
// vl.column().fieldN("label")
)
.width(width / 3 - 100)
.height(width / 4)
.facet("label")
.columns(3)
.render()
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