Published
Edited
Oct 16, 2018
1 fork
Insert cell
Insert cell
vl_spec = ({
width: 350,
height: 350,
$schema: "https://vega.github.io/schema/vega-lite/v3.json",
data: {
url: 'https://vega.github.io/vega-datasets/data/seattle-temps.csv',
format: {
parse: {date: 'utc:"%Y/%m/%d"'}
}
},
mark: "bar",
encoding: {
x: {
bin: {step: 1},
field: "temp",
type: "quantitative",
axis: {format: ".1f"}
},
y: {
aggregate: "count",
type: "quantitative"
}
}
})
Insert cell
Insert cell
Insert cell
vg_spec_hacked = {
// make a copy of the vega-lite spec
var temp = JSON.parse(JSON.stringify(vl_spec));
// graft the signal on to the specification for the bin-step
temp.encoding.x.bin = ({step: {signal: "bin_width"}});
// compile into vega
var result = embed.vl.compile(temp).spec;
// declare the signal and provide a default value
result['signals'] = [{
"name": "bin_width",
"value": 1,
}]
// return the vega spec
return result;
}
Insert cell
Insert cell
Insert cell
Insert cell
// hook up the signal to the value of the input
view_hacked.signal('bin_width', Number(step)).run()
Insert cell
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