Published
Edited
Oct 7, 2021
Insert cell
Insert cell
Insert cell
graph = vl
.markBar()
.data(data)
.width(900)
.height(500)
.encode(
vl
.x()
.fieldN("Skill")
.axis({ labelAngle: 0 })
.sort("-y"),
vl.y().fieldQ("Level"),
vl.color().fieldQ("Level"),
vl.tooltip([
{ field: "Skill", type: "Categorical" },
{ field: "Level", type: "quantitative" }
])
)
.render()
Insert cell
data = data_raw.map(d => ({
Skill: d.Skill,
Level: parseFloat(d.Level)
}))
Insert cell
data_raw = FileAttachment("skill_data@1.csv").csv()
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