Published
Edited
Aug 10, 2021
2 forks
13 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
html`<style>
.occluded { opacity:0.00001; }
svg g text {
text-anchor: middle;
pointer-events: none;
}
</style>`
Insert cell
import { occlusion } with { d3 } from "@cscheid/occlusion";
Insert cell
occlusion(d3.select(chart))
Insert cell
import { data } from "@cscheid/force-directed-graph"
Insert cell
labeledData = ({
links: data.links,
nodes: data.nodes.map(n => Object.assign({ label: n.id, priority: degree(data.links, n.id) }, n))
})
Insert cell
function degree(links, id)
{
return links.filter(n => n.source === id || n.target === id).length;
}
Insert cell
import { chart } with { onTick as onTick, labeledData as data } from "@cscheid/force-directed-graph";
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