Public
Edited
May 22
birds = FileAttachment('birds.json').json();
Inputs.table(birds, { width: 500 })
render({
data: { values: birds },
transform: [
{
aggregate: [
{op: 'mean', field: 'bill_length', as: 'mean_bill_length'},
{op: 'stderr', field: 'bill_length', as: 'sdev_bill_length'}
],
groupby: ['condition']
}
],
layer: [
{
mark: "errorbar",
encoding: {
x: {field: "mean_bill_length", type:'quantitative'},
y: {field: 'condition', type:'ordinal'},
xError:{field:'sdev_bill_length', type:'quantitative'}
}
},
{
mark: {
type: "point",
filled: true,
color: "black"
},
encoding: {
x: {
field: "mean_bill_length",
type: "quantitative"
},
y: {
field: "condition",
type: "ordinal"
}
}
}
]
})
// put your chart code or image here
render({
data:{values:birds},
facet: {
row: {field: "condition"}
},
spec: {
mark:'bar',
encoding:{
x: {field: 'bill_length'},
y: {aggregate: "count"},
color: {field: "condition"}
}
}
})
render({
data: { values: birds },
layer: [
{
mark: 'circle',
encoding: {
x: { field: 'bill_length', type: 'Q', scale: { zero: false } },
y: { field: 'bill_depth', type: 'Q', scale: { zero: false } },
color: { field: 'condition', type: 'N' }
}
},
{
mark: { type: 'line', stroke: 'black' },
transform: [{ regression: 'bill_depth', on: 'bill_length' }],
encoding: {
x: { field: 'bill_length', type: 'Q', scale: { zero: false } },
y: { field: 'bill_depth', type: 'Q', scale: { zero: false } }
}
},
{
mark: 'line',
transform: [
{
regression: 'bill_depth',
on: 'bill_length',
groupby: ['condition']
}
],
encoding:{
x: {field: 'bill_length', type: 'Q', scale: { zero: false }},
y: {field: 'bill_depth', type: 'Q', scale: { zero: false }},
color: {field: 'condition'}
}
}
]
})
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.
