Public
Edited
Mar 30, 2023
Insert cell
Insert cell
Insert cell
dataset
Insert cell
familyAsnTopology1 = FileAttachment("family-asn-topology.json").json()
Insert cell
//familyAsnTopology1 = FileAttachment("family-asn-topology.json").json()
Insert cell
Insert cell
familyAsnTopology =FileAttachment("family-asn-topology@2.json").json()
Insert cell
//data = familyAsnTopology.map(d => {
// return {
// ...d,
// nodes: d.asns,
// };
//});
Insert cell
//printTable(data)
Insert cell
d3 = require('d3@5')
Insert cell
margin = ({top: 30, right: 80, bottom: 5, left: 5});
Insert cell
width = 890 - margin.left - margin.right
Insert cell
height = 800 - margin.top - margin.bottom
Insert cell
//import {d3} from "https://cdn.skypack.dev/d3@7.0.0";
Insert cell
html`
<style>

.links {
// stroke: #999;
stroke-opacity: 0.4;
// stroke-width: 1px;
}

text {
pointer-events: none;
fill: #000;
font: 10px sans-serif;
}

svg{
border:1px solid #000;
}

</style>`
Insert cell
import {printTable} from "@uwdata/data-utilities"
Insert cell
colorScale = d3.scaleOrdinal() //=d3.scaleOrdinal(d3.schemeSet2)
.domain(["Team A", "Team B", "Team C", "Team D", "Team E"])
.range(['#ff9e6d', '#86cbff', '#c2e5a0','#fff686','#9e79db'])
Insert cell
//create a simulation for an array of nodes, and compose the desired forces.
simulation = d3.forceSimulation()
.force("link", d3.forceLink() // This force provides links between nodes
.id(d => d.id) // This sets the node id accessor to the specified function. If not specified, will default to the index of a node.
.distance(120)
)
.force("charge", d3.forceManyBody().strength(-700)) // This adds repulsion (if it's negative) between nodes.
.force("center", d3.forceCenter(width / 2, height / 2)); // This force attracts nodes to the center of the svg area
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