31:T4f6,chart = { const d = 400; const svg = d3 .create("svg") .attr("viewBox", `${-d / 2} ${-d / 2} ${d} ${d}`) .attr("width", d) .attr("height", d) .attr("font-family", "sans-serif") .attr("font-size", 10); svg .append("g") .selectAll("circle") .data(nodes) .join("circle") .attr("cx", (d) => d.x) .attr("cy", (d) => d.y) .attr("r", 5) .attr("fill", (d) => (d.hybrids ? "black" : "white")) .attr("stroke", "black"); svg .append("g") .selectAll("text") .data(nodes) .join("text") .attr("x", (d) => d.xtext) .attr("y", (d) => d.ytext) .attr("text-anchor", "middle") .text((d) => d.clade.substring(0, 3).toUpperCase()); svg .append("g") .selectAll("line") .data(links) .join("line") .attr("x1", (d) => d.xy1.x) .attr("y1", (d) => d.xy1.y) .attr("x2", (d) => d.xy2.x) .attr("y2", (d) => d.xy2.y) .attr("stroke", "black") .attr("stroke-dasharray", (d) => (d.reliable ? 0 : 3)); const spokes = svg .selectAll("path") .data(data) .enter() .append("path") .attr("transform", (d) => `rotate(${d.angle})`) .attr("fill", "none") .attr("stroke-width", "0.02") .attr("stroke", "#fff"); return svg.node(); }32:Tedc,data = [ { section: "Porphyrion", clade: "Engleria", hybrids: true, hybrid_arr: [ { clade: "Kabschia", reliable: true }, { clade: "Aizoonia", reliable: false } ] }, { section: "Ligulatae", clade: "Aizoonia", hybrids: true, hybrid_arr: [ { clade: "Engleria", reliable: false }, { clade: "Gymnopera", reliable: true }, { clade: "Xanthizoon", reliable: true } ] }, { section: "Ligulatae", clade: "Florulentae", hybrids: true, hybrid_arr: [] }, { section: "Ligulatae", clade: "Mutatae", hybrids: true, hybrid_arr: [ { clade: "Kabschia", reliable: false }, { clade: "Xanthizoon", reliable: true } ] }, { section: "Xanthizoon", clade: "Xanthizoon", hybrids: true, hybrid_arr: [ { clade: "Kabschia", reliable: true }, { clade: "Oppositifoliae", reliable: true }, { clade: "Aizoonia", reliable: true }, { clade: "Mutatae", reliable: true }, { clade: "Gymnopera", reliable: false } ] }, { section: "Trachyphyllum", clade: "Trachyphyllum", hybrids: true, hybrid_arr: [{ clade: "Holophyllae", reliable: false }] }, { section: "Gymnopera", clade: "Gymnopera", hybrids: true, hybrid_arr: [ { clade: "Xanthizoon", reliable: false }, { clade: "Cotylea", reliable: false } ] }, { section: "Cotylea", clade: "Cotylea", hybrids: true, hybrid_arr: [{ clade: "Gymnopera", reliable: false }] }, { section: "Odontophyllae", clade: "Odontophyllae", hybrids: false, hybrid_arr: [] }, { section: "Mesogyne", clade: "Mesogyne", hybrids: true, hybrid_arr: [] }, { section: "Saxifraga", clade: "Saxifraga", hybrids: true, hybrid_arr: [{ clade: "Triplinervium", reliable: true }] }, { section: "Saxifraga", clade: "Triplinervium", hybrids: true, hybrid_arr: [ { clade: "Saxifraga", reliable: true }, { clade: "Holophyllae", reliable: true }, { clade: "Tridactylites", reliable: true } ] }, { section: "Saxifraga", clade: "Holophyllum", hybrids: true, hybrid_arr: [ { clade: "Triplinervium", reliable: true }, { clade: "Trachyphyllum", reliable: false }, { clade: "Kabschia", reliable: false } ] }, { section: "Saxifraga", clade: "Tridactylites", hybrids: true, hybrid_arr: [{ clade: "Triplinervium", reliable: true }] }, { section: "Ciliatae", clade: "Ciliatae", hybrids: false, hybrid_arr: [] }, { section: "Cymbalaria", clade: "Cymbalaria", hybrids: true, hybrid_arr: [] }, { section: "Merkianae", clade: "Merkianae", hybrids: false, hybrid_arr: [] }, { section: "Micranthes", clade: "Stellares", hybrids: true, hybrid_arr: [] }, { section: "Micranthes", clade: "Cuneifoliatae", hybrids: true, hybrid_arr: [] }, { section: "Micranthes", clade: "Micranthes", hybrids: true, hybrid_arr: [] }, { section: "Micranthes", clade: "Rotundifoliae", hybrids: true, hybrid_arr: [] }, { section: "Irregulares", clade: "Irregulares", hybrids: false, hybrid_arr: [] }, { section: "Hetersia", clade: "Hetersia", hybrids: true, hybrid_arr: [] }, { section: "Porphyrion", clade: "Kabschia", hybrids: true, hybrid_arr: [ { clade: "Holophyllae", reliable: false }, { clade: "Xanthizoon", reliable: true }, { clade: "Mutatae", reliable: false }, { clade: "Engleria", reliable: true } ] }, { section: "Porphyrion", clade: "Oppositifoliae", hybrids: true, hybrid_arr: [{ clade: "Xanthizoon", reliable: true }] } ]33:T768,euphrasia = [ { index: "rostkoviana" }, { index: "montana", rostkoviana: 1 }, { index: "anglica", rostkoviana: 1, arctica: 1, tetraquetra: 1, nemorosa: 1, confusa: 1, micrantha: 1 }, { index: "rivularis", rostkoviana: 1, scottica: 1 }, { index: "vigursii", tetraquetra: 1 }, { index: "arctica", rostkoviana: 1, montana: 1, tetraquetra: 1, nemorosa: 1, pseudokerneri: 1, confusa: 1, frigida: 1, foulaensis: 1, ostenfeldii: 1, marshallii: 1, campbelliae: 1, micrantha: 1, scottica: 1, heslop_harrisonii: 1 }, { index: "tetraquetra", vigursii: 1 }, { index: "nemorosa", rostkoviana: 1, tetraquetra: 1, pseudokerneri: 1, stricta: 1, ostenfeldii: 1, scottica: 1, salisburgensis: 1 }, { index: "pseudokerneri", tetraquetra: 1 }, { index: "stricta" }, { index: "confusa", rostkoviana: 1, montana: 1, tetraquetra: 1, nemorosa: 1, pseudokerneri: 1, frigida: 1, foulaensis: 1, cambrica: 1, ostenfeldii: 1, marshallii: 1, micrantha: 1, scottica: 1 }, { index: "frigida", ostenfeldii: 1, micrantha: 1, scottica: 1 }, { index: "foulaensis", nemorosa: 1, ostenfeldii: 1, marshallii: 1, micrantha: 1, scottica: 1 }, { index: "cambrica", ostenfeldii: 1, scottica: 1 }, { index: "ostenfeldii", scottica: 1 }, { index: "marshallii", nemorosa: 1, micrantha: 1, scottica: 1 }, { index: "rotundifolia" }, { index: "campbelliae", nemorosa: 1, confusa: 1, foulaensis: 1, micrantha: 1 }, { index: "micrantha", rostkoviana: 1, tetraquetra: 1, nemorosa: 1, ostenfeldii: 1, scottica: 1, salisburgensis: 1 }, { index: "scottica" }, { index: "heslop_harrisonii", nemorosa: 1 }, { index: "salisburgensis", tetraquetra: 1 } ]34:T517,chart_euphrasia = { const d = 400; const svg = d3 .create("svg") .attr("viewBox", `${-d / 2} ${-d / 2} ${d} ${d}`) .attr("width", d) .attr("height", d) .attr("font-family", "sans-serif") .attr("font-size", 9); const labels = svg .append("g") .selectAll("text") .data(nodes_euphrasia) .join("text") .attr("x", (d) => d.xtext) .attr("y", (d) => d.ytext) .attr("text-anchor", "middle") .text((d) => d.index.substring(0, 4).toUpperCase()); const links = svg .append("g") .selectAll("line") .data(links_euphrasia) .join("line") .attr( "id", (d) => d.clade1 + "_" + d.clade2 + "_" + d.clade2 + "_" + d.clade1 ) .attr("x1", (d) => d.xy1.x) .attr("y1", (d) => d.xy1.y) .attr("x2", (d) => d.xy2.x) .attr("y2", (d) => d.xy2.y) .attr("stroke", "black"); const nodes = svg .append("g") .selectAll("circle") .data(nodes_euphrasia) .join("circle") .attr("id", (d) => d.index + "_" + d.hybrid_arr.join("_")) .attr("cx", (d) => d.x) .attr("cy", (d) => d.y) .attr("r", 8) .attr("fill", "white") .attr("stroke", "black"); nodes.on("mouseover", function (event, d) { let hi_lin = links.selectAll(); d3.selectAll(""); }); return svg.node(); }35:[] 2f:{"title":"Hybridisation in the genus Saxifraga","cells":[{"id":0,"value":"# Hybridisation in the genus *Saxifraga*","pinned":false,"hidden":false,"mode":"md"},{"id":262,"value":"md`A recreation of a cool little graph I saw in *Saxifrages of Europe* ${bib.value.get(\n \"gornall1989saxifrages\"\n)}, showing the extent of hybridisation between the subsections of the genus *Saxifraga*. Filled circles indicate within subsection hybridisation reported, and dashed lines are uncertian hybrid reports.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":30,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":233,"value":"bib = genBibliography(citations)","pinned":false,"hidden":false,"mode":"ojs"},{"id":213,"value":"md`### Plotting data and functions`","pinned":false,"hidden":false,"mode":"ojs"},{"id":72,"value":"CircleRadius = 150","pinned":false,"hidden":false,"mode":"ojs"},{"id":58,"value":"function rotate(d) {\n return ((d.start + d.end) / 2 / Math.PI) * 180 + 90;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":98,"value":"links = {\n let arr = [];\n\n // walk through array\n for (let i = 0; i < nodes.length; i++) {\n // walk through hybrid array\n for (let j = 0; j < nodes[i].hybrid_arr.length; j++) {\n if (nodes[i].hybrid_arr.length > 0) {\n arr.push({\n clade1: nodes[i].clade,\n xy1: { x: nodes[i].x, y: nodes[i].y },\n clade2: nodes[i].hybrid_arr[j].clade,\n xy2: getXandY(nodes[i].hybrid_arr[j].clade),\n reliable: nodes[i].hybrid_arr[j].reliable\n });\n }\n }\n }\n return arr.filter((d) => d.xy2 !== undefined);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":44,"value":"nodes = {\n let angle = (2 * Math.PI) / data.length;\n\n for (let i = 0; i < data.length; i++) {\n let angle_i = angle * i;\n // data[i].start = angle_i;\n\n data[i].x = CircleRadius * Math.cos(angle_i);\n data[i].y = CircleRadius * Math.sin(angle_i);\n\n data[i].xtext = (CircleRadius + 25) * Math.cos(angle_i);\n data[i].ytext = (CircleRadius + 25) * Math.sin(angle_i);\n }\n return data;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":105,"value":"getXandY = function (clade) {\n for (let i = 0; i < nodes.length; i++) {\n if (nodes[i].clade === clade) {\n return {\n x: nodes[i].x,\n y: nodes[i].y\n };\n }\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":325,"value":"links_euphrasia = {\n let arr = [];\n\n // walk through array\n for (let i = 0; i < nodes_euphrasia.length; i++) {\n // walk through hybrid array\n for (let j = 0; j < nodes_euphrasia[i].hybrid_arr.length; j++) {\n if (nodes_euphrasia[i].hybrid_arr.length > 0) {\n arr.push({\n clade1: nodes_euphrasia[i].index,\n xy1: { x: nodes_euphrasia[i].x, y: nodes_euphrasia[i].y },\n clade2: nodes_euphrasia[i].hybrid_arr[j],\n xy2: getXandY_euphrasia(nodes_euphrasia[i].hybrid_arr[j])\n // reliable: nodes_euphrasia[i].hybrid_arr[j].reliable\n });\n }\n }\n }\n return arr;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":334,"value":"getXandY_euphrasia = function (clade) {\n for (let i = 0; i < nodes_euphrasia.length; i++) {\n if (nodes_euphrasia[i].index === clade) {\n return {\n x: nodes_euphrasia[i].x,\n y: nodes_euphrasia[i].y\n };\n }\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":320,"value":"nodes_euphrasia = {\n let angle = (2 * Math.PI) / euphrasia2.length;\n\n for (let i = 0; i < euphrasia2.length; i++) {\n let angle_i = angle * i;\n euphrasia2[i].start = angle_i;\n\n euphrasia2[i].x = CircleRadius * Math.cos(angle_i);\n euphrasia2[i].y = CircleRadius * Math.sin(angle_i);\n\n euphrasia2[i].xtext = (CircleRadius + 25) * Math.cos(angle_i);\n euphrasia2[i].ytext = (CircleRadius + 25) * Math.sin(angle_i);\n }\n return euphrasia2;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":210,"value":"md`### Data`","pinned":false,"hidden":false,"mode":"ojs"},{"id":170,"value":"function shiftData(data, n) {\n for (let i = 0; i < n; i++) {\n data.push(data.shift());\n }\n return data;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":309,"value":"euphrasia2 = euphrasia.map((d) => {\n let keys = Object.keys(d);\n keys.shift();\n keys.pop();\n d.hybrid_arr = keys;\n return d;\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":288,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":206,"value":"md`### Imports`","pinned":false,"hidden":false,"mode":"ojs"},{"id":31,"value":"d3 = require(\"d3@7\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":222,"value":"citations = [\n `@book{gornall1989saxifrages,\n title={Saxifrages of Europe: With Notes on African, American and Some Asiatic Species},\n author={Gornall, RJ},\n year={1989},\n publisher={Christopher Helm}\n}`\n]","pinned":false,"hidden":false,"mode":"ojs"},{"id":225,"value":"Cite = require(\"https://bundle.run/citation-js@0.5.0-alpha.10\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":230,"value":"// from https://observablehq.com/@lsh/bibtex#genBibliography\nfunction genBibliography(bibliography, opt = {}) {\n let { reftype, style, output } = {\n output: \"html\",\n reftype: \"indexed\",\n style: \"citation-apa\",\n ...opt\n };\n const cite = new Cite();\n for (const b of bibliography) {\n cite.add(b);\n }\n const authorObj = cite\n .get()\n .sort((a, b) => (a.author[0].family > b.author[0].family ? 1 : -1));\n const authormap = [];\n for (const [i, o] of Object.entries(authorObj)) {\n authormap.push([\n o.id,\n reftype == \"indexed\" ? `\\[${+i + 1}\\]` : `(${o.author[0].family})`\n ]);\n }\n const bibcontainer = cite.get({ type: output, style: style });\n if (reftype == \"indexed\") {\n bibcontainer.querySelectorAll(\".csl-entry\").forEach((e, i) => {\n e.innerHTML = `[${i + 1}] ${e.innerHTML}`;\n });\n }\n const result = html`${bibcontainer}`;\n result.value = new Map(authormap);\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":352,"value":"md`## Hybridisation in *Euphrasia*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":354,"value":"md`I had the data for the genus I worked on in my PhD, so I thought why not!`","pinned":false,"hidden":false,"mode":"ojs"},{"id":342,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W35","stdlib":"1","titling":"auto"}