Public
Edited
Sep 19, 2023
Insert cell
Insert cell
Insert cell
Insert cell
function f(x) {
function registerEvent(span) {
let svg = span.querySelector("svg");
let color = svg.getAttribute("fill");
span.addEventListener("click", _ => {
let path = x.querySelector(`path[stroke="${color}"]`);
if(svg.hasAttribute("opacity")) {
svg.removeAttribute("opacity");
path.removeAttribute("opacity");
} else {
svg.setAttribute("opacity","0.2");
path.setAttribute("opacity","0.2");
}
});
}
let legend = x.firstChild;
let spans = legend.querySelectorAll("span");
for(let i=0; i<spans.length; i++) {
registerEvent(spans[i]);
}
return x;
}
Insert cell
data = [
...generateSerie("c01",[1281,1134,1190,1342,1007,1113,897,1065,1630]),
...generateSerie("c02",[1591,562,951,1028,852,752,773,812,552]),
...generateSerie("c04",[1712,437,261,967,345,974,678,450,43]),
...generateSerie("c08",[4859,138,1042,373,564,808,489,45,82]),
...generateSerie("c16",[7840,130,59,78,59,180,59,139,58]),
]
Insert cell
Insert cell

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.
Learn more