viewof data = new NonRepeatingView({love:true,peace:false,understanding:false})
bind(form(html`<form>
<input name='love' type='checkbox' ${data.love?'checked':''}>love<br>
<input name='peace' type='checkbox' ${data.peace?'checked':''}>peace<br>
<input name='understanding' type='checkbox' ${data.understanding?'checked':''}>understanding<br>
${button(!(data.love && data.peace && data.understanding))}
</form>`),viewof data)
data
button = newval => {
const button = html`<button>${newval?'all':'none'}</button>`;
button.onclick = () => {viewof data.value = {love:newval,peace:newval,understanding:newval}};
return button
};
_ = require('lodash')
import {bind} from '@mbostock/synchronized-views'
import {form} from '@mbostock/form-input'
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.
