Published
Edited
Sep 18, 2018
1 star
md`# D3 Categorical Chart`
chart = {
const svg = d3.select(DOM.svg(width, height));
let categoryTooltip = svg
.append("g")
.attr(
"transform",
"translate(" + width / 2 + " ," + height / 2 + ")"
);
categoryTooltip
.append("rect")
.attr("class", "tooltip_bg")
.attr("opacity", "0")
.style("fill", "white")
.attr("x", -100)
.attr("y", -25)
.attr("rx", 20)
.attr("ry", 20)
.attr("width", 200)
.attr("height", 50);
categoryTooltip
.append("text")
.attr("class", "pressed_category_tooltip")
.attr("y", 7)
.style("font-family", "sans")
.style("font-size", "24px")
.style("text-anchor", "middle");
drawCategories(svg)
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.
