Published
Edited
May 30, 2021
Importers
4 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
import { graph, nodes, links } from '@taniki/regionales-2021-data'
Insert cell
Insert cell
Insert cell
Insert cell
current = permutations[sorting]()
Insert cell
permutations = orders(graph)
Insert cell
orders = ({ nodes, links }) => {
const n = nodes.length;
const matrix = Array.from(nodes, (_, i) =>
d3.range(n).map(j => ({ x: j, y: i, z: 0 }))
);
const index = nodes.map((d, i) => ("id" in d ? d.id : i));
const l = [];

for (const node in nodes) nodes.count = 0;
links.forEach(link => {
const i = index.indexOf(link.source),
j = index.indexOf(link.target);
if (!("value" in link)) link.value = 1;
matrix[i][j].z += link.value;
matrix[j][i].z += link.value;
matrix[i][j].z += link.value;
matrix[j][i].z += link.value;
nodes[i].count += link.value;
nodes[j].count += link.value;
l.push({ source: i, target: j, value: link.value });
});

const adjacency = matrix.map(row => row.map(c => c.z));

const graph = reorder
.graph()
.nodes(nodes)
.links(l)
.init();

let dist_adjacency;

const leafOrder = reorder.optimal_leaf_order();
//.distance(science.stats.distance.manhattan);

function computeLeaforder() {
const order = leafOrder(adjacency);
order.forEach((lo, i) => (nodes[i].leafOrder = lo));
return nodes.map(n => n.leafOrder);
}

function computeLeaforderDist() {
if (!dist_adjacency) dist_adjacency = reorder.graph2valuemats(graph);
const order = reorder.valuemats_reorder(dist_adjacency, leafOrder);
order.forEach((lo, i) => (nodes[i].leafOrderDist = lo));
return nodes.map(n => n.leafOrderDist);
}

function computeBarycenter() {
const barycenter = reorder.barycenter_order(graph);
const improved = reorder.adjacent_exchange(graph, ...barycenter);
improved[0].forEach((lo, i) => (nodes[i].barycenter = lo));
return nodes.map(n => n.barycenter);
}

function computeRCM() {
const rcm = reorder.reverse_cuthill_mckee_order(graph);
rcm.forEach((lo, i) => (nodes[i].rcm = lo));
return nodes.map(n => n.rcm);
}

function computeSpectral() {
const spectral = reorder.spectral_order(graph);
spectral.forEach((lo, i) => (nodes[i].spectral = lo));
return nodes.map(n => n.spectral);
}

const orders = {
none: () => d3.range(n),
name: () =>
d3.range(n).sort((a, b) => d3.ascending(nodes[a].id, nodes[b].id)),
// count: () => d3.range(n).sort((a, b) => nodes[b].count - nodes[a].count),
cluster: () =>
d3
.range(n)
.sort(
(a, b) =>
d3.ascending(nodes[a].cluster, nodes[b].cluster) ||
d3.ascending(nodes[a].name, nodes[b].name)
),
leafOrder: computeLeaforder,
leafOrderDist: computeLeaforderDist,
barycenter: computeBarycenter,
rcm: computeRCM,
spectral: computeSpectral
};

return orders;
}
Insert cell
Insert cell
Inputs.table(groups.n)
Insert cell
groups = {
let n_ids = nodes.map(n=> n.id)
let n = nodes
let l = links.map(l=>({
'source': n_ids.indexOf(l.source),
'target': n_ids.indexOf(l.target),
'count': l.value,
'value': l.value

}))

let clusters = netClustering.cluster(n, l)
return ({n, l, clusters})
}
Insert cell
Insert cell
Insert cell
mouseIn = (e, i) => {
mutable currentPair = [ i.source, i.target ].sort((a,b) => a.localeCompare(b))
}
Insert cell
mutable currentPair = []
Insert cell
Insert cell
computeMatrix = (nodes) => {
const matrix = [];
const n = nodes.length;
for (let i = 0; i < n; i++) {
var k = 0;
for (let j = n - 1; j > i; j--) {
let value = 0
for(const link of links){
let pair = [ nodes[i].id, nodes[j].id ] .sort((a,b) => a.localeCompare(b))
if(link.source == pair[0] && link.target== pair[1]){
value = link.value
}
}
matrix.push({
source: nodes[i].id,
target: nodes[j].id,
x: (k) * boxSize,
y: i * boxSize,
opacity: (value > 0)? Math.ceil(value/3) * 0.25 :0,
color: (nodes[i].cluster == nodes[j].cluster) ? 'black' : "red",
value: value,
tooltip: `${nodes[i].id} + ${nodes[j].id} : `
});
k++;
}
}
return matrix;
}
Insert cell
Insert cell
boxSize = 25
Insert cell
import { legend } from '@d3/color-legend'
Insert cell
netClustering = require("netclustering")
Insert cell
reorder = require('reorder.js@^2.0.2')
Insert cell
import { select } from "@jashkenas/inputs"
Insert cell
import { gsdesc } from '@taniki/regionales-2021-data'
Insert cell
d3 = require('d3')
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