2e:null 2f:["$","title",null,{"children":"GARD viz - summarise breakpoints | spyros-lytras | Observable"}] 34:T6ad,html`

${gard_results_json.input["number of sequences"]} sequences in the alignment	${gard_results_json.input["number of sites"]} sites in the alignment	${gard_results_json.potentialBreakpoints} potential breakpoints
${_.size(gard_results_json.improvements)} inferred breakpoints	${gard_results_json.totalModelCount} models considered
${floatFormat(gard_results_json.baselineScore - gard_results_json.bestModelAICc)} Δ c-AIC vs the null model	${floatFormat(gard_results_json.singleTreeAICc - gard_results_json.bestModelAICc)} Δ c-AIC vs the single tree multiple partition

`35:T422,fig1=vegalite ({ hconcat: [ { width: 650, height: stages*12, "data": {"values": gard_breakpoints}, "mark": {type: "point", tooltip : true, filled : true}, "encoding": { "x": {"field": "bp", "type": "quantitative", "axis" : {"grid" : false, "title" : "Coordinate"}}, "y": {"field": "model", "type": "ordinal", "axis" : {title: "# breakpoints"}}, "size" : {"condition": {"test": "datum['span'] >= " + stages/stage_thresh, "value": "64"}, "value": "16"}, "color" : {"condition": {"test": "datum['span'] >= " + stages/stage_thresh, "value": "firebrick"}, "value": "gray"} } }, { width: 120, height: stages*12, "data": {"values": caic_improvements}, "mark": {type: "line", tooltip : true, filled : false, points: true}, "encoding": { "x": {"field": "daic", "type": "quantitative", "axis" : {"grid" : false, "title" : "Delta c-AIC"}, scale : {"type" : "log"}}, "y": {"field": "bp", "type": "ordinal", "axis" : null}, } } ]})36:T71d,displayed_trees = { return _.map (tree_objects, (tree_object,i)=> { let tree = tree_object.tree; var t = tree.render("#tree_" + i, { height:svgSize, width:300, 'show-scale' : true, 'is-radial' : false, 'left-right-spacing': 'fit-to-size', 'top-bottom-spacing': 'fit-to-size', 'node_circle_size' : (n)=>0 } ); t.node_label ((n)=>{ if (n.children && n.children.length) return ""; return n.data.name.substr (0,10); }); function sort_nodes (asc) { tree.traverse_and_compute (function (n) { var d = 1; if (n.children && n.children.length) { d += d3.max (n.children, function (d) { return d["count_depth"];}); } n["count_depth"] = d; }); tree.resort_children (function (a,b) { return (a["count_depth"] - b["count_depth"]) * (asc ? 1 : -1); }); } sort_nodes (true); t.style_nodes ((e,n) => { if (n.children && n.children.length) return; if (variants.indexOf (n.data.name) >= 0) { e.style ("fill", "firebrick"); } else { e.style ("fill", null); } e.selectAll ("title").data ([n.data.name]).join ("title").text ((d)=>d); }); t.style_edges ((e,n) => { if (n.target.children && n.target.children.length) return; if (variants.indexOf (n.target.data.name) >= 0) { e.style ("stroke", "firebrick"); } else { e.style ("stroke", null); } }); t.placenodes(); t.update(); return t; }); }37:T820,function multiAutoSelect(config = {}) { const { value, title, description, disabled, autocomplete = "off", placeholder, size, options, list = "variants" } = Array.isArray(config) ? { options: config } : config; const optionsSet = new Set(options); const form = input({ type: "text", title, description, attributes: { disabled }, action: fm => { const addSelectedOption = d => { const ele = html`${d} `; ele.querySelector("button").addEventListener("click", b => { fm.value.splice(fm.value.indexOf(d), 1); renderSelection(); fm.dispatchEvent(new CustomEvent("input")); fm.input.focus(); }); return ele; }; function renderSelection() { fm.output.innerHTML = ""; for (let o of fm.value) { fm.output.appendChild(addSelectedOption(o)); } } fm.input.value = ""; fm.value = value || []; fm.onsubmit = e => e.preventDefault(); fm.input.oninput = function(e) { e.stopPropagation(); if ( optionsSet.has(fm.input.value) && fm.value.indexOf(fm.input.value) === -1 ) { fm.value.push(fm.input.value); renderSelection(); fm.dispatchEvent(new CustomEvent("input")); fm.input.value = ""; } }; renderSelection(); }, form: html` ` }); form.output.style["margin-left"] = "0px"; return form; }38:Tc29,html` `39:[] 32:{"id":"cfda0f731644bc9b","slug":"gard-viz-bps","title":"GARD viz - summarise breakpoints","thumbnail":"32598985e45bd77d858539a2bf98e058991a404b250e68ca899ae8520d7d9036","access_level":"public","create_time":"$D2026-02-13T04:54:41.617Z","update_time":"$D2026-02-13T05:02:59.625Z","view_time":null,"first_public_time":"$D2026-02-13T05:01:11.122Z","has_unpublished_edits":null,"fork":{"id":"a5c552192f0bfbf4","slug":"plotting-gard-breakpoint-support","title":"GARD analysis result visualization","owner":{"id":"9bf992815a7b66f2","login":"spond","name":"Sergei Pond"}},"stars":0,"starred":false,"owner":{"type":"team","id":"cf7dc6d41a1d22ac","login":"spyros-lytras","name":"","avatar_url":"https://avatars-next.observableusercontent.com/c95ad1f3c75de4549c43230fafb46f1f84546986881e9401d9114c2ee2354520","tier":"starter_2024"},"version":1112,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"d0adadfb03845a21","login":"spyros-lytras","name":"","avatar_url":"https://avatars-next.observableusercontent.com/c95ad1f3c75de4549c43230fafb46f1f84546986881e9401d9114c2ee2354520","tier":null}],"members":[{"type":"individual","id":"d0adadfb03845a21","login":"spyros-lytras","name":"","avatar_url":"https://avatars-next.observableusercontent.com/c95ad1f3c75de4549c43230fafb46f1f84546986881e9401d9114c2ee2354520","tier":null,"role":"editor"},{"type":"team","id":"cf7dc6d41a1d22ac","login":"spyros-lytras","name":"","avatar_url":"https://avatars-next.observableusercontent.com/c95ad1f3c75de4549c43230fafb46f1f84546986881e9401d9114c2ee2354520","tier":"starter_2024","role":"viewer"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"GARD viz - summarise breakpoints","cells":[{"id":0,"value":"md`# GARD viz - summarise breakpoints`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":660,"value":"md`Load a GARD JSON result file `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":89,"value":"viewof gard_results_file = params.get (\"url\") ? localFileInput({accept: [\".json\",\".gz\"], value : params.get (\"url\"), disable: true}) : localFileInput({accept: [\".json\",\".gz\"]})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":592,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1092,"value":"md`
\n### ${redbps.length} best breakpoints:\n${redbps.toString()}\n

` ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1100,"value":"viewof stage_thresh= slider({\n min: 1, \n max: 15, \n step: 0.5, \n value: 2, \n title: \"this is the proportion of models that you want the final breakpoints to appear in. e.g., If it is 3 and you have 30 model (30 final breakpoints) then your final breakpoints will need to appear in at least 10 models (30 fn models / 3). The final number and list of positions will show above\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":538,"value":"fig1label=md`**Figure 1**. Left: the best placement of breakpoints inferred by the algorithm for each number of breakpoints considered. Right: the improvement in the c-AIC score between successive breakpoint numbers (log scale).`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":434,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":577,"value":"fig2_label=md`**Figure 2**. Model-averaged support for breakpoint placement`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":486,"value":"fig2=vegalite ({\n width: 800,\n height: 200,\n \"data\": {\"values\": site_support},\n \"mark\": {type: \"rule\", tooltip : true},\n \"encoding\": {\n \"x\": {\"field\": \"bp\", \"type\": \"quantitative\", \"axis\" : {\"grid\" : false, title : \"coordinate\"}},\n \"y\": {\"field\": \"support\", \"type\": \"quantitative\", \"axis\" : {\"grid\" : false, title : \"Model averaged support\"}},\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":689,"value":"fig3_label=md`**Figure 3**. Total tree length by partition`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":728,"value":"fig3=vegalite ({\n width: 800,\n height: 200,\n \"data\": {\"values\": tree_lengths},\n \"mark\": {type: \"line\", tooltip : true, point : false},\n \"encoding\": {\n \"x\": {\"field\": \"x\", \"type\": \"quantitative\", \"axis\" : {\"grid\" : false, title : \"Coordinate\"}},\n \"y\": {\"field\": \"L\", \"type\": \"quantitative\", \"axis\" : {\"grid\" : false, title : \"Total tree length\"}, \"scale\" : {\"type\" :\"sqrt\"}},\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":744,"value":"fig4_label = md`**Figure 4.** Trees for individial fragments`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":839,"value":"viewof variants = multiAutoSelect({\n options: seqNames (tree_objects[0].tree),\n title: \"Select some sequences to highlight\",\n placeholder: \"Select some sequences\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":747,"value":"fig4=html`${makeTreeDivs()}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"html`\n \n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1097,"value":"redbps = {\n var allredbps = Array.from(gard_breakpoints, function(d){ if(d.span >= stages/stage_thresh) {return d.bp} }).filter(function(x) {\n return x !== undefined;});\n \n var uniqredbps = [...new Set(allredbps)];\n \n return uniqredbps.sort((a,b)=>a-b)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":476,"value":"stages = _.size (gard_results_json.improvements)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":638,"value":"floatFormat = d3.format (\"2g\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":99,"value":"gard_results_json =await get_json (params.get (\"url\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1076,"value":"get_json = async (json_source)=> {\n if (json_source) {\n if (json_source.substr (json_source.length-3) == \".gz\") {\n return JSON.parse (pako.inflate(await d3.buffer(json_source), { to: 'string' }));\n }\n return d3.json (json_source);\n try {\n return d3.json (json_source);\n } catch {}\n //results_file.json();\n }\n try {\n return JSON.parse (pako.inflate(await gard_results_file.arrayBuffer(), { to: 'string' }));//results_file.json();\n } catch {}\n return gard_results_file.json();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":543,"value":"caic_improvements = {\n let accumulator = 0;\n return _.map (gard_results_json['improvements'], (d,i)=> {\n let delta = d.deltaAICc;\n if (i > 0 && d.deltaAICc > gard_results_json['improvements'][0].deltaAICc) {\n delta = delta - accumulator;\n }\n accumulator += delta;\n return {'bp' : d.breakpoints.length, 'daic' : delta};\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":423,"value":"gard_breakpoints = {\n let bp = {};\n return _.chain(gard_results_json.improvements).map ( (d)=> {\n bp\n return _.map (d.breakpoints, (b)=>{\n if (!bp[b[0]]) bp[b[0]] = [];\n bp[b[0]].push (d.breakpoints.length)\n return {'bp' : b[0], 'model' : d.breakpoints.length};\n });\n }).flatten().each ((d)=>d.span = d3.max (bp[d.bp]) - d3.min (bp[d.bp])).value();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":116,"value":"gard_result_table = {\n return _.chain (gard_results_json['siteBreakPointSupport']).toPairs().map ((d)=>{return {'site' : +d[0], 'support' : d[1]}}).value();\n} ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1083,"value":"params = new URLSearchParams(location.search)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"d3 = require (\"d3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":416,"value":"floatFmt = d3.format (\".2g\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":841,"value":"seqNames = (tree)=> {\n let seq_names = [];\n tree.traverse_and_compute (n=>{\n if (n.children && n.children.length) return;\n seq_names.push (n.data.name);\n });\n return seq_names;\n};","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":878,"value":"svgSize = Math.max (seqNames (tree_objects[0].tree).length * 10, 300)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":488,"value":"site_support = _.chain(gard_results_json[\"siteBreakPointSupport\"]).toPairs().map ((d)=>{return {'bp' : +d[0], 'support' : d[1]}}).value()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"_=require(\"lodash\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":692,"value":"tree_objects = _.map (gard_results_json.breakpointData, (bp)=> {return {\n 'bps' : bp.bps[0],\n 'tree' : new phylotree.phylotree (bp.tree)\n}});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":714,"value":"tree_lengths = _.flatten(_.map (tree_objects, (t)=> {\n let L = totalTreeLength (t.tree);\n return [{\n 'x' : t.bps[0],\n 'L' : L\n },\n {\n 'x' : t.bps[1],\n 'L' : L\n }]\n}));","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":711,"value":"totalTreeLength = (tree)=> {\n let L = 0;\n tree.traverse_and_compute ( (n)=> {\n if (tree.branch_length (n)) {\n L += +tree.branch_length (n);\n }\n });\n return L;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":750,"value":"makeTreeDivs = ()=> {\n let rows = _.map (_.range (tree_objects.length), (i)=>[]);\n _.each (_.range (tree_objects.length), (i)=> {\n let m2 = Math.floor (i/2);\n rows[m2+1].push (\"

\");\n rows[m2].push (\"

Tree \" + (i+1) + \", coordinate range \" + tree_objects[i].bps[0] + '-' + tree_objects[i].bps[1] + \"

\");\n });\n\n return \"

\" +\n _.flatten(rows).join (\"\\n\")\n + \"

\";\n} ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":350,"value":"import {legend} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":756,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":78,"value":"phylotree=require (\"https://dl.dropboxusercontent.com/s/i528j2lqnyzknit/phylotree.js\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":127,"value":"import { table } from \"@gampleman/table\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1081,"value":"pako = require('pako@2.1.0/dist/pako.min.js')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":432,"value":"vegalite = require (\"vega-embed\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":174,"value":"import {slider, select, text, input, autoSelect} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":833,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1086,"value":"import {localFileInput} from \"@mbostock/localfile\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":587,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":598,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W39","stdlib":"1","titling":"auto"}} 33:"$32:body"