Public
Edited
Feb 11, 2021
1 fork
1 star
html`<style>
.tree_link {fill: none; stroke: #A0A0A0; stroke-width: 0.5;}
.node_circle {fill: #707070;}
.node_label {font-size: 10px; font-family: sans-serif;}
</style>
`
transition_time = 500;
animation_time = 5000;
function new_dimensions(svg) {
const {x, y, width, height} = svg.node().getBBox();
return {"x":x, "y":y, "width":width, "height":height};
}
data = d3.hierarchy(await FileAttachment("flare-2.json").json())
.sort((a, b) => d3.ascending(a.data.name, b.data.name))
vertical_tree = d3.tree().nodeSize([dx,dy*2]);
horizontal_tree = d3.tree().nodeSize([dx, dy]);
dx = 10;
dy = width/6;
radial_tree = d3.tree()
.size([2 * Math.PI, radius])
.separation((a, b) => (a.parent == b.parent ? 1 : 2) / a.depth)
width = 954
radius = width / 2
d3 = require("d3@6")
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.
