Published
Edited
Mar 3, 2020
Importers
5 stars
{
const svg = d3.create("svg")
.attr("width", width)
.attr("height", 200);
let image_url = await FileAttachment("fresh-prince.jpg").url();
svg
.node()
.appendChild(svgBackgroundImage(image_url, 200));
svg
.append("circle")
.attr("cx", 3 * width / 4)
.attr("cy", 100)
.attr("r", 100)
.attr("fill", "url(#pattern)")
svg
.append("rect")
.attr("x", width / 4 - 100)
.attr("y", 0)
.attr("height", 200)
.attr("width", 200)
.attr("fill", "url(#pattern)")
svg.append("g")
.append("path")
.attr("d", d => `M${width / 2},${100}${hex(100)}`)
.style("fill", "url(#pattern)");
return svg.node();
}
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.
