30:T17eb,rendering = { let width = 1190.551, height = 841.89, originalFontSize = 8, fontSize = originalFontSize; const svg = d3.create("svg").attr("viewBox", [0, 0, width, height]); svg .append("rect") .attr("fill", "#A7CAD3") .attr("width", width) .attr("height", height); // Legend margin svg .append("line") .attr("stroke", "#669999") .attr("x1", 200) .attr("y1", 0) .attr("x2", 200) .attr("y2", height); // Parts of margin svg .append("line") .attr("stroke", "#669999") .attr("x1", width - 200) .attr("y1", 0) .attr("x2", width - 200) .attr("y2", height); svg.append("text").text(networkName).attr("x", 10).attr("y", 30); const g1 = svg.append("g"); const g = g1 .append("g") .attr("transform", `translate(${width / 2}, ${height / 2})`); const defs = g.append("defs"); const nodes = g.append("g").classed("nodes", true); const links = g.append("g").classed("links", true); // list of parts const listOfParts = svg .append("text") .attr("transform", `translate(${width - 200},0)`) .attr("font-family", "'Helmet', sans-serif") .attr("font-size", 7) .attr("xml:space", "preserve") .classed("list-of-parts", true); const partsArray = spatialization.nodes .filter((d) => d.attributes.type.includes("Part")) .map((d) => ({ key: d.key, title: d.attributes.title, partNumber: d.attributes.partNumber, parent: d.attributes.parentNode //parentTitle: d.attributes.parentNodeTitle })); const groupedParts = d3.groups(partsArray, (d) => d.parent); let tempIndex = 1; groupedParts.forEach((d) => { d[1] = d[1].sort((a, b) => d3.ascending(a.partNumber, b.partNumber)); d[1].forEach((dd) => { dd.index = tempIndex; tempIndex++; }); }); mutable global_partsArray = groupedParts; const parentNodesTspan = listOfParts .selectAll("tspan") .data(groupedParts) .enter() .append("tspan") .attr("dy", 8.5) .attr("x", 0) .text((d) => { let pn = spatialization.nodes.find((n) => n.key === d[0]); // just to spot what goes wrong if (!pn) { pn = { key: "MISSING-PARENT-KEY" + d[0], attributes: { title: "MISSING-PARENT-TITLE" + d[0], year: "MISSING-PARENT-YEAR" + d[0], publisher: "MISSING-PARENT-PUBLISHER" + d[0] } }; } let text = `|||${pn.attributes.title}`; if (pn.attributes.type === "Book") { text += ` (${pn.attributes.year}). ${pn.attributes.publisher}`; } return text; }); const partsOf = parentNodesTspan .selectAll("tspan") .data((d) => d[1]) .enter() .append("tspan") .attr("x", 0) .attr("dy", 6.5) .html((d) => `${d.index}|||${d.title} (part n. ${d.partNumber})`); // nodes const node = nodes .selectAll(".node-group") .data(spatialization.nodes) //.join("g") .enter() .append("g") .classed("node-group", true) .attr("transform", (d) => `translate(${d.attributes.x}, ${d.attributes.y})`) .style("cursor", "pointer") .each(function (d) { drawNodes(this, fontSize, d, partsArray); }) .call(drag()); const link = links .selectAll(".link-group") .data(spatialization.edges) .enter() .append("g") .classed("link-group", true) .each(function (d) { drawEdges(this, d); }); function drag() { function dragged(event) { d3.select(this) .attr("transform", (d) => `translate(${event.x}, ${event.y})`) .each((d) => { d.attributes.x = event.x; d.attributes.y = event.y; }); g.selectAll(".node-mask-rect") .filter((d) => d.key === event.subject.key) .attr("x", event.x - 1000) .attr("y", event.y - 1000); g.selectAll(".node-mask-circle") .filter((d) => d.key === event.subject.key) .attr("cx", event.x) .attr("cy", event.y); g.selectAll("line") .filter((d) => d.source === event.subject.key) .attr("x1", event.x) .attr("y1", event.y); g.selectAll("line") .filter((d) => d.target === event.subject.key) .attr("x2", event.x) .attr("y2", event.y); g.selectAll(".edges-head") .filter((d) => d.target === event.subject.key) .attr("cx", event.x) .attr("cy", event.y); } return d3.drag().on("drag", dragged); } const title = svg .append("text") .attr("x", 5) .attr("y", height - 10) .attr("font-size", 16) .attr("font-family", "sans-serif") .attr("fill", "#FFF") .text(networkName); const spatializationValues = svg .append("text") .attr("x", width / 2) .attr("y", height - 10) .attr("font-size", 16) .attr("font-family", "sans-serif") .attr("fill", "#FFF") .attr("text-anchor", "middle") .text( `Rotation: ${alpha} – Gravity: ${gravity} – Scale: ${scalingRatio} – Edge Weight Influ: ${edgeWeightInfluence} – Weight GD: ${weightGD}` ); const transformations = svg .append("text") .attr("x", width - 5) .attr("y", height - 10) .attr("font-size", 16) .attr("font-family", "sans-serif") .attr("fill", "#FFF") .attr("text-anchor", "end") .text(`K: 1 – X: 0 – Y: 0`); const theZoomFunction = d3.zoom().on("zoom", ({ transform }) => { const display = JSON.parse(JSON.stringify(transform)); display.x = Math.round(display.x * 100) / 100; display.y = Math.round(display.y * 100) / 100; display.k = Math.round(display.k * 100) / 100; transformations.text(`K: ${display.k} – X: ${display.x} – Y: ${display.y}`); g1.attr("transform", transform); // fontSize = originalFontSize / transform.k; nodes .selectAll(".label") .attr("font-size", fontSize) .selectAll(".labelRow") .attr("dy", fontSize * 0.75); }); if (!zoomEnabled) { svg.call(theZoomFunction).on("wheel.zoom", null); } else { svg.call(theZoomFunction); } return svg.node(); }31:T5ca,spatialization = { // we define original positions so that force-atlas2 returns always the same spatiualization graphologyLayout.circular.assign(graph, {scale: 1000}); const customSettings = { adjustSizes: false, // should the node's sizes be taken into account? barnesHutOptimize: false, // whether to use the Barnes-Hut approximation to compute repulsion barnesHutTheta: 0.1, // Barnes-Hut approximation theta parameter edgeWeightInfluence: edgeWeightInfluence, // influence of the edge's weights on the layout gravity: gravity, // strength of the layout's gravity. linLogMode: false, // whether to use Noack's LinLog model. outboundAttractionDistribution: false, // ??? scalingRatio: scalingRatio, slowDown: 10, strongGravityMode: false } const sensibleSettings = forceAtlas2.inferSettings(graph); sensibleSettings.scalingRatio = scalingRatio console.log(sensibleSettings) forceAtlas2.assign(graph, { iterations: 100000, settings: sensibleSettings }); //noverlap.assign(graph, {settings:{margin:5}}); // Rotate the graph graph.forEachNode((node, attributes) => { const x = attributes.x, y = attributes.y, c = {a:0, b:0}; const x1 = (x - c.a)*Math.cos(alpha) - (y - c.b)*Math.sin(alpha) + c.a; const y1 = (x-c.a)*Math.sin(alpha) + (y - c.b)*Math.cos(alpha) + c.b; attributes.x = x1; attributes.y = y1; }); return graph.export(); }32:Td15,function drawNodes(element, fontSize, data, partsArray) { switch (data.attributes.type) { case "Avant-text": element.appendChild(d3.select(avantText).clone(true).node()); break; case "Diary Entry": element.appendChild(d3.select(diaryEntry).clone(true).node()); break; case "Book": element.appendChild(d3.select(book).clone(true).node()); break; case "PeriodicalArticle": element.appendChild(d3.select(article).clone(true).node()); break; case "Periodical": element.appendChild(d3.select(periodical).clone(true).node()); break; case "Missing node type": element.appendChild(d3.select(missingType).clone(true).node()); break; case "Missing node in dataset": element.appendChild(d3.select(missingNode).clone(true).node()); break; default: element.appendChild(d3.select(partOf).clone(true).node()); } if (data.attributes.geneticStage) { let side = 17; let gs_width = 1; let gs_rx = 4; switch (data.attributes.geneticStage) { case "Clean copy": break; case "Final manuscript": side = 18; gs_width= 2; gs_rx = 5; break; case "Corrected proofs": side = 20; gs_width= 3; gs_rx = 6; break; } d3.select(element).select("*") .attr("stroke","#6BA3AA") .attr("stroke-alignment","outer") .attr("stroke-width", gs_width) .attr("stroke-location","outside") } if(redNodes.indexOf(data.key)!==-1){ d3.select(element).select("g path").attr("fill","#ED6056").style("fill","#ED6056"); } if (data.attributes.visuals) { element.appendChild(d3.select(hasVisuals).clone(true).node()); } const label = d3 .select(element) .append("text") .classed("label", true) .attr("pointer-events","none") .attr("opacity", 0.8) .attr("text-anchor", "middle") .attr("font-size", fontSize) .attr("font-family", "'Helmet', sans-serif") .attr("y", 8) .attr("fill", "#fff"); if (!data.attributes.type.includes("Part")) { label.append("tspan") .attr("letter-spacing", "-0.075") .attr("fill", "black") .text(data.attributes.title); if (data.attributes.year && data.attributes.type!=="Diary Entry") { label .append("tspan") .classed("labelRow", true) .attr("x", 0) .attr("dy", fontSize*0.75) .attr("fill", "#333") .attr("font-family", "'DM Mono', monospace") .attr("font-size", fontSize*0.75) .text(data.attributes.year); } if (data.attributes.shelfmark) { label .append("tspan") .classed("labelRow", true) .attr("x", 0) .attr("dy", fontSize*0.75) .attr("fill", "#333") .attr("font-family", "'DM Mono', monospace") .attr("font-size", fontSize*0.75) .text(data.attributes.shelfmark); } } else { label .attr("y", 2) .append("tspan") .attr("font-size", fontSize*0.75) .attr("fill", "#CCFFFF") .text(partsArray.find(d=>d.key===data.key).index); } }33:T800,function drawEdges(element, data){ const group = d3.select(element) group.append("line") .attr( "x1", (data) => spatialization.nodes.find((dd) => dd.key === data.source).attributes.x ) .attr( "y1", (data) => spatialization.nodes.find((dd) => dd.key === data.source).attributes.y ) .attr( "x2", (data) => spatialization.nodes.find((dd) => dd.key === data.target).attributes.x ) .attr( "y2", (data) => spatialization.nodes.find((dd) => dd.key === data.target).attributes.y ) .attr("stroke", function (data) { switch (data.attributes.category) { case "geneticDossier": return "#ED6056"; break; case "msPartIsPartOf": return "#FFF"; break; case "pubPartIsPartOf": return "#FFF"; break; default: return "#333"; } }) .attr("stroke-width", 0.75) .attr("stroke-dasharray", (data) => { if (data.attributes.category.includes("IsRewritten")) { return 2; } else { return 0; } }) //.attr("mask", (data) => `url(#node-mask-${data.target})` ); group.append("circle") .classed("edges-head", true) .attr( "cx", (data) => spatialization.nodes.find((dd) => dd.key === data.target).attributes.x ) .attr( "cy", (data) => spatialization.nodes.find((dd) => dd.key === data.target).attributes.y ) .attr("r", 1) .attr("fill", function (data) { switch (data.attributes.category) { case "geneticDossier": return "#00ff00"; break; case "msPartIsPartOf": return "#00ff00"; break; case "pubPartIsPartOf": return "#00ff00"; break; default: return "#00ff00"; } }) }34:T482,edges = { const edges = []; json.forEach((d) => { connectionsNames.forEach((edge) => { //console.log(edge, d.manuscriptHasDateComputable); if (d.hasOwnProperty(edge)) { const source = d["@id"]; const source_type = recognizeAvantText( Array.isArray(d["@type"]) ? d["@type"][0] : "Missing Type", d ); const type = edge; let weight = edgeWeights.normal if (source_type === "PubPart" || source_type === "MsPart" || source_type === "GeneticDossierPart") { weight = edgeWeights.partOf } d[edge].forEach((target) => { const target_id = target["@id"] ? target["@id"] : "miss" + ObjectId(); const target_type = recognizeAvantText( getNodeType(json.find((dd) => dd["@id"] === target_id)), d ); const obj = { source: source, sourceType: source_type, target: target_id, targetType: target_type, type: type, weight: weight }; edges.push(obj); }); } }); }); return edges; }35:T716,nodes = { const nodes = []; let obj; edges.forEach((edge) => { if (nodes.map((d) => d.id).indexOf(edge.source) === -1) { const sourceNode = json.find((d) => d["@id"] === edge.source); obj = { id: sourceNode["@id"], title: getTitle(sourceNode), type: edge.sourceType, shelfmark: getShelfmark(sourceNode), date: getDate(sourceNode), year: getYear(sourceNode), visuals: getVisuals(sourceNode), geneticStage: getGeneticStage(sourceNode), publisher: getPublisher(sourceNode), partNumber: getPartNumber(sourceNode) } obj = sanitizeStringsForXML(obj) nodes.push(obj); } if (nodes.map((d) => d.id).indexOf(edge.target) === -1) { const targetNode = json.find((d) => d["@id"] === edge.target); obj = { id: edge.target, title: "Missing node in dataset", type: edge.targetType, shelfmark: "Missing node in dataset", date: "Missing node in dataset", year: "Missing node in dataset", visuals: "Missing node in dataset", geneticStage: "Missing node in dataset", publisher: "Missing node in dataset", partNumber: "Missing node in dataset" }; if (targetNode) { obj = { id: edge.target, title: getTitle(targetNode), type: edge.targetType, shelfmark: getShelfmark(targetNode), date: getDate(targetNode), year: getYear(targetNode), visuals: getVisuals(targetNode), geneticStage: getGeneticStage(targetNode), publisher: getPublisher(targetNode), partNumber: getPartNumber(targetNode) }; } obj = sanitizeStringsForXML(obj) nodes.push(obj); } }); return nodes; }36:T5d7,function removeXMLInvalidChars(str, removeDiscouragedChars) { // By John Doherty https://gist.github.com/john-doherty/b9195065884cdbfd2017a4756e6409cc // remove everything forbidden by XML 1.0 specifications, plus the unicode replacement character U+FFFD var regex = /((?:[\0-\x08\x0B\f\x0E-\x1F\uFFFD\uFFFE\uFFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF]))/g; // ensure we have a string str = String(str || '').replace(regex, ''); if (removeDiscouragedChars) { // remove everything discouraged by XML 1.0 specifications regex = new RegExp( '([\\x7F-\\x84]|[\\x86-\\x9F]|[\\uFDD0-\\uFDEF]|(?:\\uD83F[\\uDFFE\\uDFFF])|(?:\\uD87F[\\uDF' + 'FE\\uDFFF])|(?:\\uD8BF[\\uDFFE\\uDFFF])|(?:\\uD8FF[\\uDFFE\\uDFFF])|(?:\\uD93F[\\uDFFE\\uD' + 'FFF])|(?:\\uD97F[\\uDFFE\\uDFFF])|(?:\\uD9BF[\\uDFFE\\uDFFF])|(?:\\uD9FF[\\uDFFE\\uDFFF])' + '|(?:\\uDA3F[\\uDFFE\\uDFFF])|(?:\\uDA7F[\\uDFFE\\uDFFF])|(?:\\uDABF[\\uDFFE\\uDFFF])|(?:\\' + 'uDAFF[\\uDFFE\\uDFFF])|(?:\\uDB3F[\\uDFFE\\uDFFF])|(?:\\uDB7F[\\uDFFE\\uDFFF])|(?:\\uDBBF' + '[\\uDFFE\\uDFFF])|(?:\\uDBFF[\\uDFFE\\uDFFF])(?:[\\0-\\t\\x0B\\f\\x0E-\\u2027\\u202A-\\uD7FF\\' + 'uE000-\\uFFFF]|[\\uD800-\\uDBFF][\\uDC00-\\uDFFF]|[\\uD800-\\uDBFF](?![\\uDC00-\\uDFFF])|' + '(?:[^\\uD800-\\uDBFF]|^)[\\uDC00-\\uDFFF]))', 'g'); str = str.replace(regex, ''); } return str; }37:T6ab,function swatches({ color, columns = null, format = x => x, swatchSize = 15, swatchWidth = swatchSize, swatchHeight = swatchSize, marginLeft = 0 }) { const id = DOM.uid().id; if (columns !== null) return html`

${color.domain().map(value => { const label = format(value); return html`

${document.createTextNode(label)}

`; })}

`; return html`

${color.domain().map(value => html`${document.createTextNode(format(value))}`)}

`; }38:[{"id":"ef5f396c883d3f01369107566ba2a58d49e6385961cbe167a458ac76837dc1c9def9d4efc052fd85568edbd15c64c3c10b37c26de442431bddfd4cc6bf29a98d","href":"https://static.observableusercontent.com/files/ef5f396c883d3f01369107566ba2a58d49e6385961cbe167a458ac76837dc1c9def9d4efc052fd85568edbd15c64c3c10b37c26de442431bddfd4cc6bf29a98d","name":"Periodical.svg","type":"image/svg+xml","lastModified":1637587196270.22,"size":1925},{"id":"fa61c4f6529636c8c8ccb1bd633c2f6663a43110239661b24e27c555e3f0b5f31d1ffcb0c64971b9d870fe7b483b43c8d598b090875114880ce7f14035c27f8a","href":"https://static.observableusercontent.com/files/fa61c4f6529636c8c8ccb1bd633c2f6663a43110239661b24e27c555e3f0b5f31d1ffcb0c64971b9d870fe7b483b43c8d598b090875114880ce7f14035c27f8a","name":"Missing-Type.svg","type":"image/svg+xml","lastModified":1637587286314.776,"size":1502},{"id":"15c6650f98299c060e37d3727e9062412c748ac65bce8f951f2bbc76c0b247b9d7f1cf3a3844b4316f7045e5a4851c7ff790ee1cc7d0a065cb706fd40458eec3","href":"https://static.observableusercontent.com/files/15c6650f98299c060e37d3727e9062412c748ac65bce8f951f2bbc76c0b247b9d7f1cf3a3844b4316f7045e5a4851c7ff790ee1cc7d0a065cb706fd40458eec3","name":"bypass genetic dossier small.jpg","type":"image/jpeg","lastModified":1637587844815.27,"size":36675},{"id":"77d66ae5c9422ca804a9ea7110736c88b6b31c2e827b860a0e46b6e502b9f7865947d8b341133620985b73249bb3b798319058156f579eba68543b2fcb6f88fb","href":"https://static.observableusercontent.com/files/77d66ae5c9422ca804a9ea7110736c88b6b31c2e827b860a0e46b6e502b9f7865947d8b341133620985b73249bb3b798319058156f579eba68543b2fcb6f88fb","name":"Periodical@1.svg","type":"image/svg+xml","lastModified":1637593531928.198,"size":705},{"id":"e1e1ecf33b8624d027ebc2f21ca667e882bc750a1f665336f960892bd0b8effb8cd3f2c196c450efba3d85d5d8905f769228b9952b1ecc6ae863de86df7b6c53","href":"https://static.observableusercontent.com/files/e1e1ecf33b8624d027ebc2f21ca667e882bc750a1f665336f960892bd0b8effb8cd3f2c196c450efba3d85d5d8905f769228b9952b1ecc6ae863de86df7b6c53","name":"hasVisuals.svg","type":"image/svg+xml","lastModified":1637587196275.27,"size":860},{"id":"4efe17303c65b8d8b9c4a56c9f4fe9121f166a21862ff917c1eaaff6ac05c8b2116ad8ed3ac8b0c3ddb784a91264047c8cb1fc069377c699a72abc8ced55b999","href":"https://static.observableusercontent.com/files/4efe17303c65b8d8b9c4a56c9f4fe9121f166a21862ff917c1eaaff6ac05c8b2116ad8ed3ac8b0c3ddb784a91264047c8cb1fc069377c699a72abc8ced55b999","name":"Book.svg","type":"image/svg+xml","lastModified":1637587196256.299,"size":643},{"id":"65699b4a605048d6507af82c7e5c234bb3975fc1dc53c17a1e3b6aa19243f5c2f492e1ed547122858dd0534ae7691a78333ce6c08b827ace9e8b4e99ac17c4c2","href":"https://static.observableusercontent.com/files/65699b4a605048d6507af82c7e5c234bb3975fc1dc53c17a1e3b6aa19243f5c2f492e1ed547122858dd0534ae7691a78333ce6c08b827ace9e8b4e99ac17c4c2","name":"Missing-Node.svg","type":"image/svg+xml","lastModified":1637587286318.935,"size":958},{"id":"641b9e66369b702eba35a165718a18f35bf9ab900cdfd7324dc8a6b2230d93ba1bcb29f037c2da1726f78eeafd5a5a547104d2d84297378585492aab9c3366c6","href":"https://static.observableusercontent.com/files/641b9e66369b702eba35a165718a18f35bf9ab900cdfd7324dc8a6b2230d93ba1bcb29f037c2da1726f78eeafd5a5a547104d2d84297378585492aab9c3366c6","name":"AvantText.svg","type":"image/svg+xml","lastModified":1637587196267.565,"size":236},{"id":"723774af9e78649f1d841f6b21a6029b083fa9d341f53a191e8809117f6b252480b0a6fd82a1f58b19a06d178a1cfe3ec109a3c4fcdee60ebe692216cb64063e","href":"https://static.observableusercontent.com/files/723774af9e78649f1d841f6b21a6029b083fa9d341f53a191e8809117f6b252480b0a6fd82a1f58b19a06d178a1cfe3ec109a3c4fcdee60ebe692216cb64063e","name":"Legenda.png","type":"image/png","lastModified":1637588488489.254,"size":39205},{"id":"f1ed1a76c80bdd90063e0d39ecdb1a4c717e12392a187f8504e60bed1db0b71d21242ede89ac53cef9f424ff07e93b9df63b0052ff20d6809e26ab4523834dc0","href":"https://static.observableusercontent.com/files/f1ed1a76c80bdd90063e0d39ecdb1a4c717e12392a187f8504e60bed1db0b71d21242ede89ac53cef9f424ff07e93b9df63b0052ff20d6809e26ab4523834dc0","name":"Screenshot 2021-11-22 at 12.11.07.png","type":"image/png","lastModified":1637587156043.884,"size":144666},{"id":"0e8055d5a9bb2f59b8bc3767ed0ac217a7328c503e5dc6a7f2b4e217eea2fabdca839622be242fcca8ade6eeb62c3ff0333c00d889fdbd78fb53cbd8d441f026","href":"https://static.observableusercontent.com/files/0e8055d5a9bb2f59b8bc3767ed0ac217a7328c503e5dc6a7f2b4e217eea2fabdca839622be242fcca8ade6eeb62c3ff0333c00d889fdbd78fb53cbd8d441f026","name":"Article.svg","type":"image/svg+xml","lastModified":1637587196050.064,"size":1047},{"id":"636f8d6688af7a44faa2973ca1d768a13ca63438fdfef2b9757583519ba727305ef496998f612b3ffa4de7862660b53de539e6e4fcdc5e4a786b0128232964a5","href":"https://static.observableusercontent.com/files/636f8d6688af7a44faa2973ca1d768a13ca63438fdfef2b9757583519ba727305ef496998f612b3ffa4de7862660b53de539e6e4fcdc5e4a786b0128232964a5","name":"Diary.svg","type":"image/svg+xml","lastModified":1637587196082.552,"size":444},{"id":"1b8330d0ed17808c695d6d2bfc35805599e3d67ed55bb6217ee7fd547f171a4d1ca658e297971e2bbc453ffec910381b53b5face3eab20aefe49d297e2d8fb5f","href":"https://static.observableusercontent.com/files/1b8330d0ed17808c695d6d2bfc35805599e3d67ed55bb6217ee7fd547f171a4d1ca658e297971e2bbc453ffec910381b53b5face3eab20aefe49d297e2d8fb5f","name":"Part.svg","type":"image/svg+xml","lastModified":1637587196259.74,"size":200}] 2e:{"title":"Snodaroud","cells":[{"id":0,"value":"# Snodaroud\n*[@iosonosempreio](https://observablehq.com/@iosonosempreio), [@andreabenedetti](https://observablehq.com/@andreabenedetti), [@vpallacci](https://observablehq.com/@vpallacci)*\n\nThis notebook creates semi-finished network graphs representing the genetic process of a sample of Gustave Roud literary works. It reworks the original data structure, identifies nodes and edges, and bypasses nodes corresponding to *genetic dossiers* and *genetic dossier parts*. The project is part of [«Gustave Roud, Œuvres complètes»](https://github.com/gustaveroudproject/geneticNetworksDataViz).\n\nTo start, select a genetic network. Files are hosted on Github and are in `jsonld` format:","pinned":false,"hidden":false,"mode":"md"},{"id":996,"value":"branches = {\n return {\n \"master\":\"https://raw.githubusercontent.com/gustaveroudproject/geneticNetworksDataViz/master/data/dataForObservable.json\",\n \"2022-12-03\":\"https://raw.githubusercontent.com/gustaveroudproject/geneticNetworksDataViz/2021-12-03/data/dataForObservable.json\"\n } \n }","pinned":false,"hidden":false,"mode":"ojs"},{"id":1000,"value":"viewof branch = Inputs.select(Object.keys(branches), {\"label\": \"Select a GH branch\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1037,"value":"branches[branch]","pinned":false,"hidden":false,"mode":"ojs"},{"id":1108,"value":"oldData = \"https://raw.githubusercontent.com/gustaveroudproject/geneticNetworksDataViz/a55f2589eb3b29bb43f65b7fe33ab247e080f634/data/1945airSolitude/1945airSolitudeData.jsonld\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":7,"value":"viewof dataUrl = {\n let data = await d3.json(branches[branch]);\n return Inputs.select(data)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"networkName = dataUrl.split(\"/\").at(-1).split(\".\").at(0)","pinned":false,"hidden":false,"mode":"ojs"},{"id":89,"value":"## Visualization","pinned":false,"hidden":false,"mode":"md"},{"id":1087,"value":"viewof zoomEnabled = Inputs.toggle({label: \"Scrollwheel to zoom\", value: false})","pinned":false,"hidden":false,"mode":"ojs"},{"id":218,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":1074,"value":"mutable global_partsArray = \"\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":21,"value":"swatches({\n color: d3.scaleOrdinal(\n [\"Genetic dossier\", \"Is Part Of\", \"Other\"],\n [\"#ED6056\", \"#FFF\", \"#333\"]\n )\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":526,"value":"viewof alpha = Inputs.range([0,Math.PI*2],{step: 0.01, value: 0, label:\"Rotation angle\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"viewof gravity = Inputs.range([0.1, 5], {step: 0.1, value: 1, label: \"Gravity\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":17,"value":"viewof scalingRatio = Inputs.range([1, 500], {step: 1, value: 35, label: \"Scale\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":18,"value":"viewof edgeWeightInfluence = Inputs.range([0, 5], {step: 0.1, value: 1, label: \"Edge weight influence\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":384,"value":"viewof weightGD = Inputs.range([0.1,5],{step: 0.1, value: 1.6, label:\"Weight edges genetic dossier\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":803,"value":"viewof weightPartOf = Inputs.range([1,5],{step: 0.25, value: 1, label:\"Weight edges of parts\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":278,"value":"DOM.download(() => serialize(rendering), networkName, `Save as ${networkName}.svg`)","pinned":false,"hidden":false,"mode":"ojs"},{"id":368,"value":"DOM.download(() => rasterize(rendering), networkName, `Save as ${networkName}.png`)","pinned":false,"hidden":false,"mode":"ojs"},{"id":202,"value":"#### 🆓 Functions for network visualization","pinned":false,"hidden":false,"mode":"md"},{"id":206,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":209,"value":"redNodes = spatialization.edges.filter(edge=>edge.attributes.category===\"geneticDossier\").map(edge=>edge.target)","pinned":false,"hidden":false,"mode":"ojs"},{"id":212,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":215,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":94,"value":"## Data manipulation","pinned":false,"hidden":false,"mode":"md"},{"id":98,"value":"1️⃣ Load the data and do some cleaning","pinned":false,"hidden":false,"mode":"md"},{"id":1066,"value":"dataUrl","pinned":false,"hidden":false,"mode":"ojs"},{"id":101,"value":"json = {\n const jsondl = await d3.text(\"https://raw.githubusercontent.com/gustaveroudproject/geneticNetworksDataViz/1935f40388dae5ba30e7eccc02711d9cf7d40a0b/data/1927adieu/1927adieuData.jsonld\");\n const string = jsondl\n .replaceAll(\"http://rdfh.ch/0112/\",\"\")\n .replaceAll(\"http://rdfh.ch/0112/\",\"\")\n .replaceAll(\"http://www.knora.org/ontology/0112/roud-oeuvres#\",\"\")\n return JSON.parse(string)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":106,"value":"2️⃣ Create array of edges against a list of connection types that is manually compiled","pinned":false,"hidden":false,"mode":"md"},{"id":116,"value":"connectionsNames = [\n \"msIsAvantTextInGeneticDossier\",\n \"msIsAvantTextInGeneticDossierPart\",\n \"msIsReusedInDossier\",\n \"msIsReusedInDossierPart\",\n \"msIsRewrittenInMs\",\n \"msIsRewrittenInMsPart\",\n \n \"msPartIsPartOf\",\n \"msPartIsReusedInDossier\",\n \"msPartIsReusedInDossierPart\",\n \"msPartIsRewrittenInMs\",\n \"msPartIsRewrittenInMsPart\",\n \n \"geneticDossierResultsInPublication\",\n \"geneticDossierPartResultsInPubPart\",\n \n \"pubPartIsPartOf\",\n \"pubPartIsReusedInDossier\",\n \"pubPartIsReusedInDossierPart\",\n \n \"publicationIsRepublishedDossier\",\n \"publicationIsReusedInDossier\",\n \"publicationIsReusedInDossierPart\",\n\n \"isPublishedInPeriodical\"\n]","pinned":false,"hidden":false,"mode":"ojs"},{"id":560,"value":"parts_types = Array.from(new Set(edges.map(d=>d.sourceType).filter(d=>d.includes(\"Part\"))))","pinned":false,"hidden":false,"mode":"ojs"},{"id":568,"value":"edgeWeights = {\n return {\n normal: 1,\n partOf: weightPartOf,\n geneticDossier: weightGD\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":119,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":551,"value":"Inputs.table(edges)","pinned":false,"hidden":false,"mode":"ojs"},{"id":122,"value":"3️⃣ Create array of nodes","pinned":false,"hidden":false,"mode":"md"},{"id":126,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":553,"value":"Inputs.table(nodes)","pinned":false,"hidden":false,"mode":"ojs"},{"id":129,"value":"4️⃣ Bypass the genetic dossiers![bypass genetic dossier.jpg](${await FileAttachment(\"bypass genetic dossier small.jpg\").url()})","pinned":false,"hidden":false,"mode":"md"},{"id":136,"value":"cleanNodes = {\n const cleanNodes = nodes\n .filter(node=>node.type!==\"GeneticDossierPart\"&&node.type!==\"GeneticDossier\");\n\n const selectedEdges = cleanEdges.filter(edge=>edge.type.includes(\"IsPartOf\"))\n \n cleanNodes\n .forEach(node=>node.parentNode = null);\n cleanNodes\n .filter(node=>node.type.includes(\"Part\"))\n .forEach(node=>{\n const edge = selectedEdges.find(edge=>edge.source===node.id)\n if (edge) {\n const parent = edge.target\n node.parentNode = parent;\n node.parentNodeTitle = cleanNodes.find(node=>node.id===parent).title\n }\n })\n \n return cleanNodes\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":291,"value":"Inputs.table(cleanNodes)","pinned":false,"hidden":false,"mode":"ojs"},{"id":133,"value":"cleanEdges = {\n const cleanEdges = [];\n edges.forEach(edge => {\n if (edge.targetType !== \"GeneticDossierPart\" && edge.targetType !== \"GeneticDossier\") {\n if (edge.sourceType !== \"GeneticDossierPart\" && edge.sourceType !== \"GeneticDossier\") {\n cleanEdges.push(edge)\n }\n } else {\n if (edge.targetType === \"GeneticDossierPart\" || edge.targetType === \"GeneticDossier\") {\n const resultingEdge = edges.find(d=>d.source===edge.target)\n const newEdge = {\n ...edge,\n target: resultingEdge.target,\n targetType: resultingEdge.targetType,\n type: \"geneticDossier\",\n weight: weightGD\n };\n cleanEdges.push(newEdge)\n }\n }\n });\n return cleanEdges\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":295,"value":"Inputs.table(cleanEdges)","pinned":false,"hidden":false,"mode":"ojs"},{"id":139,"value":"#### 🆓 Functions for data manipulation","pinned":false,"hidden":false,"mode":"md"},{"id":145,"value":"function getNodeType(node){\n let type = \"Missing node in dataset\"\n if (node){\n type = Array.isArray(node[\"@type\"])?node[\"@type\"][0]:\"Missing node type\"\n }\n return type\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":147,"value":"function getShelfmark(node) {\n let value = null;\n \n /*let keys = Object.keys(node).filter(d => d.toLowerCase().includes(\"shelfmark\"));\n if (keys.length > 0) {\n const shelfmarkKey = keys[0]\n value = node[shelfmarkKey][0][\"@value\"]\n }*/\n\n let keyArchive = Object.keys(node).find(d => d.toLowerCase().includes(\"isinarchive\"));\n let keyShelf = Object.keys(node).find(d => d.toLowerCase().includes(\"shelfmark\"));\n\n let value2 = \"\"\n if (keyArchive) {\n const archive = node[keyArchive][0][\"@value\"]\n value2 += archive\n }\n if (keyShelf) {\n const shelfString = node[keyShelf][0][\"@value\"]\n if (shelfString!==\"/\") {\n value2 += \" / \"\n value2 += shelfString \n }\n } \n return value2;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":149,"value":"function getTitle(node) {\n // console.log(node)\n let value = null;\n let keys = Object.keys(node).filter(d => d.toLowerCase().includes(\"title\"));\n\n if (keys.length > 0) {\n const titleKey = keys[0]\n value = node[titleKey][0][\"@value\"]\n }\n value = value?value:node[\"@id\"]\n // console.log(value)\n return value;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":154,"value":"getDate = function (node) {\n let _date = null;\n let tempKey = Object.keys(node).find((d) => d.includes(\"DateComputable\"));\n if (tempKey) {\n _date = node[tempKey];\n }\n if (!tempKey) {\n tempKey = Object.keys(node).find((d) => d.includes(\"HasDate\"));\n if (tempKey) {\n _date = node[tempKey];\n }\n }\n _date = Array.isArray(_date) ? _date[0][\"@value\"] : _date;\n return _date;\n // keep here for reference\n const dateNames = [\n \"manuscriptHasEstablishedDateComputable\",\n \"publicationHasDate\"\n ];\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":879,"value":"getYear = function (node) {\n let _date = null;\n let tempKey = Object.keys(node).find((d) => d.includes(\"DateComputable\"));\n if (tempKey) {\n _date = node[tempKey];\n }\n if (!tempKey) {\n tempKey = Object.keys(node).find((d) => d.includes(\"HasDate\"));\n if (tempKey) {\n _date = node[tempKey];\n }\n }\n _date = Array.isArray(_date) ? _date[0][\"@value\"] : _date;\n\n if (_date) {\n let yearsArr = _date.match(/(\\d{4}-\\d{4}|\\d{4})/g)\n if (yearsArr.length === 1) {\n _date = yearsArr[0]\n }\n if (yearsArr.length === 2) {\n if (yearsArr[0] !== yearsArr[1]) {\n _date = yearsArr[0] + \"-\" + yearsArr[1]\n } else {\n _date = yearsArr[0]\n }\n }\n }\n return _date;\n // keep here for reference\n const dateNames = [\n \"manuscriptHasEstablishedDateComputable\",\n \"publicationHasDate\"\n ];\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":158,"value":"getVisuals = function(node) {\n // check if node has photos or illustrations\n let hasVisuals = null;\n hasVisuals = Object.keys(node).filter(d=>d.includes(\"HasIllustration\")||d.includes(\"HasPhoto\")).length > 0\n return hasVisuals;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":161,"value":"function getGeneticStage(node) {\n let geneticStage = null;\n if (\"hasGeneticStage\" in node) {\n geneticStage = node[\"hasGeneticStage\"][0][\"@value\"]\n }\n return geneticStage;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":903,"value":"function getPublisher(node) {\n const publisher = node.hasPublisher ? node.hasPublisher[0]['@value'] : \"\";\n return publisher\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":925,"value":"function getPartNumber(node){\n let key = Object.keys(node).find(d => d.toLowerCase().includes(\"parthasnumber\"));\n return key ? Number(node[key][0]['@value']) : \"\"\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":143,"value":"recognizeAvantText = function(type, datum) {\n if (type === \"Manuscript\") {\n const keys = Object.keys(datum);\n const temp = keys.filter(d=>d.includes(\"IsAvantText\"))\n if (temp.length === 0) {\n type = \"Diary Entry\"\n } else {\n type = \"Avant-text\"\n }\n }\n return type;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":167,"value":"## Network structure","pinned":false,"hidden":false,"mode":"md"},{"id":313,"value":"viewof nodesSize = Inputs.range([0,25],{step: 1, value: 10, label:\"Nodes size\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":175,"value":"graph = {\n // init Graph object\n const graph = new Graph();\n\n // load and add nodes\n cleanNodes.forEach((n,i)=>{\n const attributes = {...n, size: nodesSize}\n // const x = Math.random(), y=Math.random();\n // attributes.x = x;\n // attributes.y = y;\n graph.addNode(n.id, attributes)\n });\n\n cleanEdges.forEach(e=>{\n const attributes = {\n category: e.type,\n weight: e.weight\n }\n graph.addEdge(e.source, e.target, attributes)\n });\n\n return graph;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":181,"value":"#### Generate the .gexf","pinned":false,"hidden":false,"mode":"md"},{"id":187,"value":"gexfString = gexf.write(graph, {\n formatNode: function(key, attributes) { \n return {\n label: attributes.title,\n attributes: {\n type: attributes.type,\n shelfmark: attributes.shelfmark,\n date: attributes.date,\n geneticStage: attributes.geneticStage,\n hasVisuals: attributes.visuals,\n originalId: attributes.originalId\n }\n };\n },\n formatEdge: function(key, attributes) {\n return {\n label: attributes.type,\n weight: attributes.weight,\n attributes: {\n category: attributes.category\n }\n };\n }\n});","pinned":false,"hidden":false,"mode":"ojs"},{"id":194,"value":"button(gexfString, `${networkName}.gexf`)","pinned":false,"hidden":false,"mode":"ojs"},{"id":23,"value":"# Appendix","pinned":false,"hidden":false,"mode":"md"},{"id":73,"value":"import {button} from \"@1d97a907c33b084c/download-data-button\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":76,"value":"import {ObjectId} from \"@1d97a907c33b084c/mongodb-objectid-generator\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":275,"value":"import {serialize, rasterize} from \"@mbostock/saving-svg\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":80,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"},{"id":83,"value":"function sanitizeStringsForXML(object){\n for (let key in object) {\n const varType = typeof object[key]\n if (varType !== \"number\") {\n object[key] = removeXMLInvalidChars(object[key], true)\n }\n }\n return object;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":29,"value":"function entity(character) {\n return `&#${character.charCodeAt(0).toString()};`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":27,"value":"$37","pinned":false,"hidden":false,"mode":"ojs"},{"id":34,"value":"linkColor = d3.scaleOrdinal().range([\"#ED6056\", \"#ED6056\", \"#333\", \"#FFF\", \"#333\", \"#FFF\", \"#ED6056\"]).domain(d3.map(cleanEdges, e => e.type).sort(d3.ascending))","pinned":false,"hidden":false,"mode":"ojs"},{"id":234,"value":"***Network graph***","pinned":false,"hidden":false,"mode":"md"},{"id":241,"value":"We use [Graphology](https://graphology.github.io/)","pinned":false,"hidden":false,"mode":"md"},{"id":171,"value":"Graph = require(\"graphology\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":173,"value":"forceAtlas2 = require(\"https://bundle.run/graphology-layout-forceatlas2@0.6.1\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":393,"value":"graphologyLayout = require(\"https://bundle.run/graphology-layout@0.4.0\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":302,"value":"noverlap = require(\"https://bundle.run/graphology-layout-noverlap@0.4.1\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":189,"value":"gexf = require(\"https://bundle.run/graphology-gexf@0.8.1\");","pinned":true,"hidden":false,"mode":"ojs"},{"id":38,"value":"***Graphical elements***","pinned":false,"hidden":false,"mode":"md"},{"id":47,"value":"FileAttachment(\"Screenshot 2021-11-22 at 12.11.07.png\").image()","pinned":false,"hidden":false,"mode":"ojs"},{"id":43,"value":"function extractVectors(text) {\n const document = (new DOMParser).parseFromString(text, \"image/svg+xml\");\n // extrapolate the svg node from its original context\n const svg = d3.select(document.documentElement).remove();\n const gliph = svg.select(\"*\")\n return gliph.node()\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":50,"value":"article = {\n const text = await FileAttachment(\"Article.svg\").text();\n return extractVectors(text);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":53,"value":"avantText = {\n const text = await FileAttachment(\"AvantText.svg\").text();\n return extractVectors(text);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":55,"value":"book = {\n const text = await FileAttachment(\"Book.svg\").text();\n return extractVectors(text);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":58,"value":"diaryEntry = {\n const text = await FileAttachment(\"Diary.svg\").text();\n return extractVectors(text);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":61,"value":"hasVisuals = {\n const text = await FileAttachment(\"hasVisuals.svg\").text();\n return extractVectors(text);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":63,"value":"partOf = {\n const text = await FileAttachment(\"Part.svg\").text();\n return extractVectors(text);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":65,"value":"periodical = {\n const text = await FileAttachment(\"Periodical@1.svg\").text();\n return extractVectors(text);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":68,"value":"missingType = {\n const text = await FileAttachment(\"Missing-Type.svg\").text();\n return extractVectors(text);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":70,"value":"missingNode = {\n const text = await FileAttachment(\"Missing-Node.svg\").text();\n return extractVectors(text);\n}","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W38","stdlib":"1","titling":"auto"}