addShadowFilter = (
defs,
id,
{
dx = 0.45,
dy = 0.45,
height = "100%",
stdDeviation = 1,
userSpace = false
} = {}
) => {
const shadowFilter = defs
.append("filter")
.attr("id", id)
.attr("filterUnits", userSpace ? "userSpaceOnUse" : "objectBoundingBox")
.attr("height", height);
shadowFilter
.append("feGaussianBlur")
.attr("in", "SourceAlpha")
.attr("stdDeviation", stdDeviation);
shadowFilter
.append("feOffset")
.attr("dx", dx)
.attr("dy", dy)
.attr("result", "offsetblur");
shadowFilter
.append("feComponentTransfer")
.append("feFuncA")
.attr("type", "linear")
.attr("slope", "1")
.attr("result", "0");
const merge = shadowFilter.append("feMerge");
merge.append("feMergeNode");
merge.append("feMergeNode").attr("in", "SourceGraphic");
}
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.
