Public
Edited
Mar 16, 2023
Insert cell
Insert cell
viewof replay = Inputs.button("Replay")
Insert cell
Insert cell
Insert cell
// import { drag } from "@d3/force-directed-graph"
function drag(simulation) {
function dragstarted(event) {
if (!event.active) simulation.alphaTarget(0.3).restart();
event.subject.fx = event.subject.x;
event.subject.fy = event.subject.y;
}

function dragged(event) {
event.subject.fx = event.x;
event.subject.fy = event.y;
}

function dragended(event) {
if (!event.active) simulation.alphaTarget(0);
event.subject.fx = null;
event.subject.fy = null;
}

return d3
.drag()
.on("start", dragstarted)
.on("drag", dragged)
.on("end", dragended);
}
Insert cell
margin = ({top: 0, right: 0, bottom: 0, left: 0})
Insert cell
color_2 = d3.scaleLinear()
.domain([0, 10])
.range(["#f0f0f0", "#377504"]);
Insert cell
update = chart.update(graph)
Insert cell
graph100 = FileAttachment("graph_MONDO_0004095_100.json").json()// graph1 = ({
// nodes: [
// {id: "a"},
// {id: "b"},
// {id: "c"}
// ],
// links: []
// })
Insert cell
graph40 = FileAttachment("graph_MONDO_0004095_40.json").json()
Insert cell
graph8 =FileAttachment("graph_MONDO_0004095_8.json").json()

Insert cell
graph6 =FileAttachment("graph_MONDO_0004095_6.json").json()

Insert cell
graph4 =FileAttachment("graph_MONDO_0004095_4.json").json()

Insert cell
graph10 = FileAttachment("graph_MONDO_0004095_10.json").json()// graph2 = ({
Insert cell
graph1 =FileAttachment("graph_MONDO_0004095_1.json").json()
Insert cell
graph2 =FileAttachment("graph_MONDO_0004095_2.json").json()

Insert cell

graph0 =FileAttachment("graph_MONDO_0004095_0.json").json()
Insert cell
color = d3.scaleOrdinal(d3.schemeTableau10)
Insert cell
height = 400
Insert cell
d3 = require("d3@6")
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