pixel flipper, data sifter. trying to see what I can while I'm here
// viewof linkStrength = slider({min:0, max:1, value: 0.3, step:0.05, description:"Link Force Strength"})
deconstructed = {
let steps = []
const links = data.links.map(d => Object.create(d));
const nodes = data.nodes.map(d => Object.create(d));
const simulation = d3.forceSimulation(nodes)
.force("link", d3.forceLink(links).id(d => d.id)
.distance(linkDistance)
// .strength(link => {
// return 1 / Math.min(count(link.source), count(link.target))
// })
)
.force("charge", d3.forceManyBody()
.strength(manyBodyStrength)
.distanceMax(distanceMax)
)
.force("center", d3.forceCenter(width / 2, height / 2));
for(let i = 0; i < numTicks; i++) {
simulation.tick()
const copies = new Map(nodes.map(n => [n, {x: n.x, y: n.y, id: n.id, group: n.group}]));
steps.push({
nodes: Array.from(copies.values()),
links: links.map(({source, target, value}) => {
return {
value,
source: copies.get(source),
target: copies.get(target),
}
})
})
}
simulation.stop()
return steps
}
{
let x = { foo: "bar" }
let y = Object.assign(x)
return y
}
data = FileAttachment("miserables.json").json()
height = 600
color = {
const scale = d3.scaleOrdinal(d3.schemeCategory10);
return d => scale(d.group);
}
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.
