Public
Edited
Feb 22, 2023
viewof graph = {
const height = 800;
const el = d3
.create("svg")
.attr("width", width)
.attr("height", height)
.attr("viewBox", [0, 0, width, height])
.attr("style", "max-width: 100%; height: auto; height: intrinsic;")
.attr("fill", "currentColor")
.attr("font-size", 10)
.attr("font-family", "sans-serif")
.attr("text-anchor", "middle");
const pack = d3.pack().size([width, height]);
const hierarchy = d3.hierarchy(data).sum((...args) => console.log({ args }));
pack(hierarchy);
el.selectAll("circle")
.data(hierarchy.children)
.join("circle")
.attr("r", (d) => d.r)
.attr("transform", ({ x, y }) => `translate(${x},${y})`);
return el.node();
}
data = ["Apple", "Google", "Netflix", "IBM", "Dell", "HP"].map(
(name, weight) => ({
name,
weight: 0
})
)
name = "brian"
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.
