vl.markCircle()
.data(
// provide inline CSV data!
vl.csv().values('a,b,c\n1,2,3\n4,5,6\n7,8,9\n6,5,4\n3,2,1')
)
.encode(
vl.x().fieldQ('a').axis({tickMinStep: 1}),
vl.y().fieldQ('b').axis({tickMinStep: 1}),
vl.size().fieldQ('c').legend({titleAnchor: 'middle'})
)
.render()
{
const points = vl.markCircle()
.data(vl.csv().name('rawCSV')) // lookup 'rawCSV' from the datasets object
.encode(
vl.x().fieldQ('a').axis({tickMinStep: 1}),
vl.y().fieldQ('b').axis({tickMinStep: 1}),
vl.size().fieldQ('c').legend({titleAnchor: 'middle'})
);
return vl.layer(
points,
points.mark('line').encode(vl.size().value(2))
)
.datasets({rawCSV: 'a,b,c\n1,2,3\n4,5,6\n7,8,9\n6,5,4\n3,2,1'})
.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.
