Published
Edited
Oct 25, 2021
1 fork
13 stars
Insert cell
Insert cell
data = simplify(experimentalSchema, maxDepth)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
schema = FileAttachment("schemaorg-current-https.jsonld").json()
Insert cell
experimentalSchema = FileAttachment("tree.jsonld").json()
Insert cell
Insert cell
root = d3.hierarchy(experimentalSchema);
Insert cell
stats = {
const stats = {};
const graph = schema["@graph"];
return {
types: graph.filter(d => d["@type"] === "rdfs:Class").length,
properties: graph.filter(d => d["@type"] === "rdf:Property").length,
enumerationValues: root.find(d => d.data.name === "Enumeration").leaves().length
};
}
Insert cell
simplify = (data, maxDepth = 0) => {
const simplify = (sourceNode, actualDepth = 0) => {
const node = {
name: sourceNode.name,
};
if (sourceNode.children && ((actualDepth + 1) <= maxDepth)) {
node.children = [];
for (const sourceChild of sourceNode.children) {
const child = simplify(sourceChild, actualDepth + 1);
node.children.push(child);
}
}
else {
node.value = 1; // required for the sunburst chart implementation
}
return node;
}
return simplify(data);
}
Insert cell
Insert cell
charts = new Map([
["Dendogram, cartesian", clusterDendogram],
["Dendogram, radial", radialDendogram],
["Icicle", icicle],
["Icicle, zoomable", zoomableIcicle],
["Indented tree", indentedTree],
["Sunburst", sunburst],
["Sunburst, zoomable", zoomableSunburst],
["Tidy tree, cartesian", tidyTree],
["Tidy tree, cartesian, collapsible", collapsibleTree],
["Tidy tree, radial", radialTidyTree]
]);
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
columns = [
{
label: "Leaves",
value: d => d.children ? 0 : 1,
format: (value, d) => d.children ? value : "-",
x: 280
}
]
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
dataHierarchy = d3.hierarchy(data);
Insert cell
d3 = require("d3-hierarchy@2")
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