data_flat = FileAttachment("legoThemeColors@8.csv").csv({typed: false })
data_filtered = data_flat.filter(function(d) { return d.year == range })
data = ({
children: Array.from(
Array.from(d3.groups(data_filtered, d => d.theme_name) ,
//Array.from(d3.groups(data_flat, d => d.theme_name) ,
([, children]) => ({children}))
)
})
height = 900
tooltip = {
chart
const tooltip = d3.select("svg").append("div")
.attr("class", "svg-tooltip")
.style("position", "absolute")
.style("visibility", "hidden")
.text("I'm a circle!");
d3.select("#circle")
.on("mouseover", function(){
return tooltip.style("visibility", "visible");
})
.on("mousemove", function(){
return tooltip.style("top", (d3.event.pageY-10)+"px").style("left",(d3.event.pageX+10)+"px");
})
.on("mouseout", function(){
return tooltip.style("visibility", "hidden");
});
}
d3 = require("d3@5", "d3-array@2")
legoThemeColors@8.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
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.
