The avatar for @mbostock
Mike Bostock
Visualization toolmaker. Founder @observablehq. Creator @d3. Former @nytgraphics. Pronounced BOSS-tock.
Published
Edited
Dec 7, 2019
10 stars
Insert cell
Insert cell
lit = import("lit-html@1")
Insert cell
html = lit.html
Insert cell
Insert cell
function render(template, element = document.createElement("span"), options) {
lit.render(template, element, options);
return element;
}
Insert cell
Insert cell
helloTemplate = (name) => html`<div>Hello ${name}!</div>`
Insert cell
Insert cell
render(helloTemplate("Steve"))
Insert cell
render(helloTemplate("Kevin"))
Insert cell
Insert cell
render(helloTemplate(name), this)
Insert cell
name = {
const names = ["Steve", "Kevin"];
for (let i = 0, n = names.length; true; i = (i + 1) % n) {
yield Promises.tick(1000, names[i]);
}
}
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