Wise Fool.
Visioneer.
AoCBanner({
year: "2021",
day: "00",
title: "title",
story: "story",
fill: "lime",
background: "black",
})
AoCBanner = ({
title = "Advent of Code",
story = "story",
year = "2021",
day = "00",
fill = "lime",
flood = "red" ,
background = "black",
radius = 6,
blur = 6,
opacity = .5
}) => {
const banner = d3.create("svg")
.attr("width", width)
.attr("height", width/16*9)
.attr("viewBox", [0,0,16*72,9*72])
.style("background-color", background)
;
// const grid = Grid({background}).sketch();
// const {pad, plot} = grid.sketch();
// const banner = pad;
style(banner);
const defs = banner.append("defs");
head({defs, title, story, year, day, id: "advent-of-code", fill});
filter({defs, id: "glow", flood, radius, blur, opacity});
glow({sketch: banner, id: "advent-of-code", filter: "glow" });
// grid.position("front");
// banner
// .append("rect")
// .attr("y", M(4))
// .attr("x", M(3))
// .attr("width", M(6.2))
// .attr("height", M(6.2))
// .attr("stroke", "white")
// .attr("fill", "none")
// .attr("stroke-width", 1)
// ;
return banner.node()//plot();
}
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.
