Research Application Manager with the Alan Turing Institute / PhD from @GC_CUNY / formerly Research Software Engineer @LivingwMachines and @dhinstitutes project mgr
Public
Edited
Nov 24, 2022
data = {
const urls = {
nodes:
"https://docs.google.com/spreadsheets/d/e/2PACX-1vTz_3alkMj1NY56P4ZJzBVjmgVDFN71XVCjmSK6rQX45awfBgXetpVI23xvEsKa39Jsz2NW-JvF7OYW/pub?gid=305618985&single=true&output=tsv",
links:
"https://docs.google.com/spreadsheets/d/e/2PACX-1vTz_3alkMj1NY56P4ZJzBVjmgVDFN71XVCjmSK6rQX45awfBgXetpVI23xvEsKa39Jsz2NW-JvF7OYW/pub?gid=624273204&single=true&output=tsv"
};
const _nodes = await d3.tsv(urls.nodes);
const _links = await d3.tsv(urls.links);
// create a group lookup object
const groups = Object.fromEntries(
[...new Set(_nodes.map((node) => node.group))]
.sort()
.map((d, ix) => [d, ix])
);
// set up a links object
const links = _links.map((link) =>
Object.assign({
source: link.source,
target: link.target,
link
})
);
// create list of all link sources and targets ("valid links")
const validLinks = _.flatten(links.map((l) => [l.source, l.target]));
// set up nodes & validate that they exist in the links list
const nodes = _nodes
.map((node) =>
Object.assign({
id: node.id,
group: groups[node.group],
node
})
)
.filter((d) => validLinks.includes(d.id)); // filter nodes to only include those that are in the list of valid links
return { nodes, links };
}
groupedGraph(data, {
height: 1000,
margin: 1.2,
excludeGroups: [0], // exclude the first group (ie. the empty one)
label: (d) => d.node.name, // d.id if you want latin spelling, d.node.name if you want Hebrew
r: (d) => +d.node.radius + 1, // added +1 to make the zeroes at least visible... you could do a scale here
labelStyle: {
fontSize: 12,
fontFamily: "serif",
color: false
}
}).node()
import { groupedGraph, basicStyling } from "@kallewesterling/groupedgraph"
basicStyling
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.
