31:Tae7,viewer = { // define background const svg = d3 .create("svg") .attr("viewBox", [0, 0, width, height]) .style('background-color', "white"); const leftcol = 300 const toprow = 150 const sizefac = (width - 4*margin.left - leftcol)/(uniqval.length -0.999) const yfac = (height - 4*margin.top)/(thehosts.length -1) const spritesize = 120 const spritesize2 = 70 //site number svg.append('text') .attr("x", margin.left) .attr('y', margin.top) .text(refcol.replace('aa', '')) .attr('fill', 'pink') .attr("font-size", "100px") //amino acids (columns) var a; for (a of uniqval) { svg.append('text') .attr("x", (margin.left + leftcol + uniqval.indexOf(a)*sizefac)) .attr('y', margin.top) .text(a) .attr('fill', 'black') .attr("font-size", "60px") }; //for each host var h; for (h of thehosts) { //host picture svg.append("image") .attr("x", (margin.left)) .attr('y', (margin.top + 0.4*toprow + thehosts.indexOf(h)*yfac)) .attr('width', spritesize) .attr('height', spritesize) .attr("xlink:href", await hostsprites[h]) //.on('mouseover', handleMouseOver()) //.on('mouseout', handleMouseOut()); // human clade definition if ( splithost == 'toggle' ) { svg.append("image") .attr("x", (margin.left - 50)) .attr('y', (margin.top + 0.45*toprow + thehosts.indexOf(h)*yfac)) .attr('width', spritesize2) .attr('height', spritesize2) .attr("xlink:href", await hostsprites2[h]) } //value for each amino acid for (a of uniqval) { var theval = countOccurrences(data.filter(obj => {return obj[hostdef] === h}).map(b => b[col]), a) svg.append('text') .attr("x", (margin.left + leftcol + uniqval.indexOf(a)*sizefac)) .attr('y', (margin.top + toprow + thehosts.indexOf(h)*yfac)) .text(theval) .attr('fill', distcolor(theval)) .attr("font-size", "48px") } } //clade diagram // svg.append("rect") // .attr("stroke", "pink") // .attr('stroke-width', 2) // .attr("fill", "none") // .attr("x", 10) // .attr("y", 20) // .attr("width", (thebreaks[i]*(w-20))/thebreaks[0]) // .attr("height", 10) // .attr('opacity', 0.5); // svg.append('text') // .attr("x", ((thebreaks[i]*(w-20))/thebreaks[0])) // .attr('y', h-160) // .text(thebreaks.length - i) // .attr('fill', 'black') // .attr("font-size", "8px") // } // } return svg.node(); }32:[{"id":"63b253f06b230bbb56baaaa81cd4b23558d152b08643c25458d38c9006bcefcc631738e93715afb72f9232bb53c5cd74539b31ee8f39ebed0a224206114c2d2b","href":"https://static.observableusercontent.com/files/63b253f06b230bbb56baaaa81cd4b23558d152b08643c25458d38c9006bcefcc631738e93715afb72f9232bb53c5cd74539b31ee8f39ebed0a224206114c2d2b","name":"A_NP_ahsec_noN_f99_reftoal.csv","type":"text/csv","lastModified":1627313662144.488,"size":6278},{"id":"e8f242ca65ee2baffb8952e869be6a4d16cc8c11ccea517e4a5009235888b2c2e756c4287ae6fd8a8dea34ea7b0eb2cefab3366c5e58ad372072a7437be0ebb4","href":"https://static.observableusercontent.com/files/e8f242ca65ee2baffb8952e869be6a4d16cc8c11ccea517e4a5009235888b2c2e756c4287ae6fd8a8dea34ea7b0eb2cefab3366c5e58ad372072a7437be0ebb4","name":"A_NP_ahsec_noN_reftoal@1.csv","type":"text/csv","lastModified":1627134449186.876,"size":6279},{"id":"2e9ac9a34386e5340e67a399d83d3d7a260ad801314c88dd64ade8ff53c6b64e69781d2578719aede3eac9519750fca149d45ff6b7bec871ee50aff10077e678","href":"https://static.observableusercontent.com/files/2e9ac9a34386e5340e67a399d83d3d7a260ad801314c88dd64ade8ff53c6b64e69781d2578719aede3eac9519750fca149d45ff6b7bec871ee50aff10077e678","name":"duck.png","type":"image/png","lastModified":1655293140903.878,"size":2617},{"id":"71d420c9a2b0ed53b470c5ec4d59a0a9360373a14be740f7066e7f761e277733a4c274eee612d0a07cf4470fdebf4d8c6cbfd3ef0f99bbe35aee088e05f13744","href":"https://static.observableusercontent.com/files/71d420c9a2b0ed53b470c5ec4d59a0a9360373a14be740f7066e7f761e277733a4c274eee612d0a07cf4470fdebf4d8c6cbfd3ef0f99bbe35aee088e05f13744","name":"human.png","type":"image/png","lastModified":1655293953503.16,"size":2791},{"id":"a4fdc97a01fa7f57ad2bdde2169d4fadcbb568759ee540e71687027408a2727c53c467a8f31498d92cc8c869263a7da22f1ed2455e99291f1d7ac0c23aa4d020","href":"https://static.observableusercontent.com/files/a4fdc97a01fa7f57ad2bdde2169d4fadcbb568759ee540e71687027408a2727c53c467a8f31498d92cc8c869263a7da22f1ed2455e99291f1d7ac0c23aa4d020","name":"pig.png","type":"image/png","lastModified":1655293993507.678,"size":5391},{"id":"8150bd65e0a300dbb2a73af5db2bd7acd81a54e256cac643b1950eb4614a656f165b45e336b52e9151cf01da62797bde1310054194984f1f410efb454318bf6d","href":"https://static.observableusercontent.com/files/8150bd65e0a300dbb2a73af5db2bd7acd81a54e256cac643b1950eb4614a656f165b45e336b52e9151cf01da62797bde1310054194984f1f410efb454318bf6d","name":"horse.png","type":"image/png","lastModified":1655294125031.245,"size":2770},{"id":"b309272bf0d34e1ffa623de31dacde631e8d4f27d2add9b8d5e16da94548d70fdf7c5223e2abe487a7329573bdc6b844e75fa0da1563d9615caebfd2a1875f2b","href":"https://static.observableusercontent.com/files/b309272bf0d34e1ffa623de31dacde631e8d4f27d2add9b8d5e16da94548d70fdf7c5223e2abe487a7329573bdc6b844e75fa0da1563d9615caebfd2a1875f2b","name":"dog.png","type":"image/png","lastModified":1655294198930.578,"size":6729}] 2f:{"title":"Influenza A virus NP site variation","cells":[{"id":0,"value":"md`# Influenza A virus NP site variation\n\nThis notebook is part of online supplementary for our study [Zoonotic avian influenza viruses evade human BTN3A3 restriction](https://www.biorxiv.org/content/10.1101/2022.06.14.496196v1)\n\n
\nType 'aa' and you NP site of interest below and the residue distribution for each host group will appear.\n- (site enumeration is based on the PR8 reference NP sequence)\n- (host order is: avian, human, swine, canine, equine)\n\nBy ticking the 'f99 set' box below you'll see frequencies based on a filtered set. This means that there are less sequences that are almost identical from the original set. You'll notice that there's less human sequences, since there's few distinct human outbreaks of influenza A and multiple sequences sampled in pandemics would have been removed.\n
\n
`","pinned":false,"hidden":false,"mode":"ojs"},{"id":453,"value":"viewof f99ch = checkbox({\n description: \"Click for dataset filtered by sequence similarity\",\n options: [{ value: \"toggle\", label: \"f99 set\" }],\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":817,"value":"viewof splithost = checkbox({\n description: \"Click for split human host counts\",\n options: [{ value: \"toggle\", label: \"split human by clad\" }],\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":65,"value":"viewof refcol = autoSelect({\n options:Object.keys(reftoal),\n placeholder:'Type NP aa site',\n value:'aa313'})","pinned":false,"hidden":false,"mode":"ojs"},{"id":166,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":524,"value":"md`\n
\n## Data download\n
\nBelow you can download data for any number of sites in a csv (excel-friendly) file format.\n\nJust select all the sites you're interested in the list below (ctrl + click to select multiple) and then click the Download CSV button!\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":580,"value":"DOM.download(mk_csv(tabdat), csv_filename, \"Download CSV\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":604,"value":"viewof aach = select({\n options:Object.keys(reftoal).map(function(x){return x.replace('aa', '');}),\n multiple: true,\n size:10})","pinned":false,"hidden":false,"mode":"ojs"},{"id":427,"value":"md`
\nThe data for selected sites can also be downloaded as a FigTree readable annotation file below:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":866,"value":"DOM.download(mk_csv(treeAnnot), 'figtree.tsv', \"Download FigTree annotation file\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":422,"value":"divider('blue')","pinned":false,"hidden":false,"mode":"ojs"},{"id":430,"value":"md`
\n
\n
`","pinned":false,"hidden":false,"mode":"ojs"},{"id":154,"value":"md`## Dataset\n\nDownloaded from: [NCBI Influenza Virus Resource](https://www.ncbi.nlm.nih.gov/genomes/FLU/Database/nph-select.cgi?go=database)\n\n- protein coding region\n- Type: A\n- Host: Avian, Canine, Equine, Human, Swine\n- Protein: NP\n- Full-length only\n- Collapse identical sequences\n\n>{accession} {country} {host} {serotype} {year} {strain}\n\n
\n\nFiltering for the 'f99 set' has been done using [mmseq2](https://github.com/soedinglab/MMseqs2) with a 99% minimum sequence identity threshold:\n\n~~~\nmmseqs cluster al_A_NP_cds_ahsec_noN al_A_NP_cds_ahsec_noN_clu tmp --min-seq-id 0.99 --cov-mode 0\n~~~\n\n
\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":324,"value":"md`\n
\n
\n## Data & Code\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":397,"value":"col = reftoal[refcol]","pinned":false,"hidden":false,"mode":"ojs"},{"id":804,"value":"thisZscore = maxZscores[refcol]","pinned":false,"hidden":false,"mode":"ojs"},{"id":799,"value":"Object.entries(maxZscores).sort((a,b) => b[1]-a[1]).reverse()//.map(x => x[0])","pinned":false,"hidden":false,"mode":"ojs"},{"id":735,"value":"maxZscores = {\n \n const allSites = new Object();\n \n var s;\n for (s of Object.keys(allProp)) {\n\n var uniqaa = new Set(Array.from(Object.keys(allProp[s]), function(a) { return Object.keys(allProp[s][a] ) } ).flat(1))\n \n const allAAobj = new Object();\n\n var u;\n for (u of [...uniqaa]) {\n \n var allhaa = thehosts.map(b => allProp[s][b][u] ).map(v => v === undefined ? 0 : v);\n \n allAAobj[u] = allhaa.reduce((a, b) => a + b, 0) / allhaa.length;\n \n }\n\n var zScores = Array.from(Object.values(allAAobj), function(x) { \n var allAvg = Object.values(allAAobj);\n var allAvgAvg = allAvg.reduce((a, b) => a + b, 0) / allAvg.length;\n return ( x - allAvgAvg ) / getStandardDeviation(allAvg)\n })\n \n allSites[s] = Math.max(...zScores) / Object.values(allAAobj).length\n \n }\n \n return allSites\n }","pinned":false,"hidden":false,"mode":"ojs"},{"id":618,"value":"allProp = {\n \n const allSites = new Object();\n \n var s;\n for (s of Object.keys(reftoal)) {\n \n const countObj = new Object(); \n\n var h;\n for (h of thehosts) {\n var hostAllaa = data.filter(obj => {return obj.Host === h}).map(b => b[ reftoal[s] ]);\n var hostUniq = new Set(hostAllaa);\n const tObj = new Object();\n var u;\n for (u of [...hostUniq]) {\n tObj[u] = countOccurrences(hostAllaa, u)\n }\n \n var tObjAvg = new Object(); var t;\n for (t of Object.keys(tObj)) { tObjAvg[t] = tObj[t]/theSum(tObj)}\n countObj[h] = tObjAvg\n }\n \n allSites[s] = countObj\n \n }\n\n return allSites\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":753,"value":"function getStandardDeviation (array) {\n const n = array.length\n const mean = array.reduce((a, b) => a + b) / n\n return Math.sqrt(array.map(x => Math.pow(x - mean, 2)).reduce((a, b) => a + b) / (n-1))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":710,"value":"function theSum(obj){\n return Object.values(obj).reduce((a, b) => a + b, 0)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":590,"value":"csv_filename = {\n var name = '';\n if (f99ch == \"toggle\"){\n name = 'flu_np_sites_f99.csv'\n }\n else{\n name = 'flu_np_sites.csv' \n }\n return name\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":535,"value":"tabdat = {\n \n var theout = ''\n const aa_arr = aach.map(function(x){return 'aa'+x})\n var s;\n // s stands for site number selected in the checkbox\n for ( s of aa_arr ) {\n \n var theseval = [...new Set(data.map(a => a[ reftoal[s] ] ) ) ];\n \n theout += s\n \n //v stands for each unique amino acid present in site position s\n var v;\n for ( v of theseval){\n \n theout += ',' + v\n \n }\n\n theout += '\\n' \n \n //h stands for host\n var h;\n for ( h of thehosts ){\n \n theout += h \n \n var a;\n for ( a of theseval ){\n \n var thecount = countOccurrences(data.filter(obj => {return obj[hostdef] === h}).map(b => b[ reftoal[s] ]), a)\n \n theout += ',' + thecount\n \n } \n \n theout += '\\n' \n\n }\n \n theout += '\\n\\n' \n \n }\nreturn theout\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":848,"value":"treeAnnot = {\n \n var theout = ''\n const aa_arr = aach.map(function(x){return 'aa'+x});\n \n var colnams = Object.keys(data[0]).filter( x => x.slice(0,2) != 'aa' );\n \n var allcols = colnams.concat(aa_arr);\n \n // define header\n var c;\n for (c of allcols) {theout += c + '\\t'}\n theout += '\\n'\n\n var o;\n // o stands for object in the data array\n for ( o of data ) {\n\n //co stands for each column\n var co;\n for ( co of allcols ){ \n if (co.slice(0,2) === 'aa'){\n theout += o[reftoal[co]] + '\\t'\n }\n else{\n theout += o[co] + '\\t'\n }\n }\n //theout = theout.slice(-1)\n theout += '\\n' \n\n }\nreturn theout\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":493,"value":"reftoal['aa498']","pinned":false,"hidden":false,"mode":"ojs"},{"id":229,"value":"thecols = data.columns.splice(7, data.columns.length)","pinned":false,"hidden":false,"mode":"ojs"},{"id":824,"value":"hostdef = { if ( splithost == 'toggle' ) { var thehostdef = 'SplitHost' }\n else { var thehostdef = 'Host' }\nreturn thehostdef\n} ","pinned":false,"hidden":false,"mode":"ojs"},{"id":264,"value":"thehosts = [...new Set(data.map(a => a[hostdef]))];","pinned":false,"hidden":false,"mode":"ojs"},{"id":118,"value":"viewof colval = select(uniqval)","pinned":false,"hidden":false,"mode":"ojs"},{"id":137,"value":"byhost = data.filter(obj => {return obj.Host === 'Avian'})","pinned":false,"hidden":false,"mode":"ojs"},{"id":49,"value":"uniqval = [...new Set(data.map(a => a[col]))];","pinned":false,"hidden":false,"mode":"ojs"},{"id":108,"value":"countOccurrences(data.map(a => a[col]), colval)","pinned":false,"hidden":false,"mode":"ojs"},{"id":836,"value":"hostsprites2 = Object({\n 'Human1':FileAttachment(\"human.png\").url(),\n 'Human2':FileAttachment(\"pig.png\").url(),\n 'Human3':FileAttachment(\"duck.png\").url(),\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":304,"value":"hostsprites = Object({'Avian':FileAttachment(\"duck.png\").url(),\n 'Human': FileAttachment(\"human.png\").url(),\n 'Human1':FileAttachment(\"human.png\").url(),\n 'Human2':FileAttachment(\"human.png\").url(),\n 'Human3':FileAttachment(\"human.png\").url(),\n 'Swine': FileAttachment(\"pig.png\").url(),\n 'Canine':FileAttachment(\"dog.png\").url(),\n 'Equine':FileAttachment(\"horse.png\").url()})","pinned":false,"hidden":false,"mode":"ojs"},{"id":94,"value":"countOccurrences = (arr, val) => arr.reduce((a, v) => (v === val ? a + 1 : a), 0);","pinned":false,"hidden":false,"mode":"ojs"},{"id":861,"value":"allacc = data.map(a => a.ID)","pinned":false,"hidden":false,"mode":"ojs"},{"id":343,"value":"refobj = data.filter(obj => {return obj.ID === 'ADP07332'})[0]","pinned":false,"hidden":false,"mode":"ojs"},{"id":24,"value":"data = { if (f99ch === \"toggle\" && splithost === \"toggle\"){\n var thedata = d3.csvParse(await (await fetch('https://raw.githubusercontent.com/spyros-lytras/BTN3A3_IAV/main/NP_site_variation/A_NP_ahsec_noN_f99_aa_clad.csv')).text())}\n else if (f99ch === \"toggle\"){\n var thedata = d3.csvParse(await (await fetch(\"https://raw.githubusercontent.com/spyros-lytras/BTN3A3_IAV/main/NP_site_variation/A_NP_ahsec_noN_f99_aa.csv\")).text())}\n else if (splithost === \"toggle\"){\n var thedata = d3.csvParse(await (await fetch(\"https://raw.githubusercontent.com/spyros-lytras/BTN3A3_IAV/main/NP_site_variation/A_NP_ahsec_noN_aa_clad.csv\")).text())} \n else {\n var thedata = d3.csvParse(await (await fetch(\"https://raw.githubusercontent.com/spyros-lytras/BTN3A3_IAV/main/NP_site_variation/A_NP_ahsec_noN_aa.csv\")).text())}\n \n return thedata\n }","pinned":false,"hidden":false,"mode":"ojs"},{"id":363,"value":"reftoal = {if (f99ch == \"toggle\") \n{ var thereftoal = Object.assign({},\n ...d3.csvParse(await FileAttachment(\"A_NP_ahsec_noN_f99_reftoal.csv\").text(),\n ({al, ref}) => Object({[ref]:al})\n ))}\n \n else\n{ var thereftoal = Object.assign({},\n ...d3.csvParse(await FileAttachment(\"A_NP_ahsec_noN_reftoal@1.csv\").text(),\n ({al, ref}) => Object({[ref]:al})\n ))\n }\n return thereftoal\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":433,"value":"distcolor = d3.scaleLinear()\n .domain([0, 17000])\n .range([\"#78DEC7\", '#D62AD0'])\n .interpolate(d3.interpolateRgb.gamma(0.0001))","pinned":false,"hidden":false,"mode":"ojs"},{"id":519,"value":"function mk_csv (data) {\n return new Blob([data], {type: \"text/csv\"}) \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":417,"value":"import {divider} from \"@fossilx/fx-observable\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":72,"value":"import {checkbox, select, radio, slider, autoSelect} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"d3 = require('d3@6')","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"margin = ({top: 100, right: 50, bottom: 100, left: 50})","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"height = 1000","pinned":false,"hidden":false,"mode":"ojs"},{"id":14,"value":"width = 2000","pinned":false,"hidden":false,"mode":"ojs"},{"id":329,"value":"function handleMouseOut(d, i) {\n // Select text by id and then remove\n d3.select(\"#t\" + d.x + \"-\" + d.y + \"-\" + i).remove(); // Remove text location\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":328,"value":"// Create Event Handlers for mouse\nfunction handleMouseOver(d, i) { // Add interactivity\n\n // Use D3 to select element, change color and size\n d3.select(this).attr({\n fill: \"orange\",\n });\n // Specify where to put label of text\n svg.append(\"text\").attr({\n id: \"t\" + d.x + \"-\" + d.y + \"-\" + i, // Create an id for text so we can select it later for removing on mouseout\n x: function() { return d.x - 30; },\n y: function() { return d.y - 15; }\n })\n .text(function() {\n return [d]; // Value of the text\n });\n}\n\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":449,"value":"phylotree = require('phylotree@1.0.0-alpha.25')","pinned":false,"hidden":false,"mode":"ojs"},{"id":196,"value":"// create a tooltip\nTooltip = d3.select(\"#div_template\")\n .append(\"div\")\n .style(\"opacity\", 0)\n .attr(\"class\", \"tooltip\")\n .style(\"background-color\", \"white\")\n .style(\"border\", \"solid\")\n .style(\"border-width\", \"2px\")\n .style(\"border-radius\", \"5px\")\n .style(\"padding\", \"5px\")","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}