30:T41a,otherDataFiles = { let runnignList = [] projectData.data.hits.forEach(function(prj,i){ if (!(/TCGA/.test(prj.id))) { runnignList.push(prj.id) } }) let plotData = [] for (const id of runnignList) { let url = 'https://api.gdc.cancer.gov/files' let body = ({ 'filters':{ "op":"and", "content":[{ "op":"in", "content":{ "field":"cases.project.project_id", "value":[id] } },{ "op":"in", "content":{ "field":"access", "value":["open"] } }] }, 'from': 0, 'size': 100000 }) let thisFileData = await betterFetch(url,body) let thisSortedHistData = getSortedHistData(thisFileData.data.hits.map(x=>x.data_type)) let thisTrace = { x: Object.keys(thisSortedHistData), y: Object.keys(thisSortedHistData).map(x=>thisSortedHistData[x]), type: 'bar', name:id, } { plotData.push(thisTrace) } } return(plotData) }31:T4e1,PrintTCGA = function(projectData) { let div = DOM.element('div') // set up the main object div.innerHTML='

TCGA Project types in GDC ()

' let ol=DOM.element('ol') // set up the sub-object which will contain our data div.appendChild(ol) let caseCount=0 projectData.data.hits.forEach(function(prj,i){ // for each hit (project) if ((/TCGA/.test(prj.id))) { //if (true) { let li = DOM.element('li') // build up the header "li" li.innerHTML=`${prj.id}: ${prj.name} (${prj.summary.case_count})` caseCount=caseCount+prj.summary.case_count ol.appendChild(li) // append the header "li" to the larger object "ol" let ul = DOM.element('ul') // build up the bullets "ul" prj.disease_type.forEach(function(dtp){ // for each disease_type let li = DOM.element('li') li.style.fontSize='small' li.innerHTML=dtp ul.appendChild(li) // append one bullet "li" to the list of bullets "ul" }) li.appendChild(ul) // append the bullets "ul" to the header "li" } }) div.querySelector('#caseCountSpan').textContent=caseCount return div };32:T65c,scatterPlot = (target,data,margin,col_1,col_2) => { let features = data.columns.slice(0, data.columns.length - 1); col_1 = col_1 || features[0] col_2 = col_2 || features[1] let xScale = d3.scaleLinear() .domain([d3.min(data.map(x => x[col_1]))*0.8, d3.max(data.map(x => x[col_1]))*1.1]) .range([margin.left, margin.width - margin.right]) let yScale = d3.scaleLinear() .domain([d3.max(data.map(x => x[col_2]))*1.1, d3.min(data.map(x => x[col_2]))*0.8]) .range([margin.bottom, margin.height - margin.top]) let xAxis = g => g.attr("class", "xAxis") .attr('transform', `translate(0, ${margin.height - margin.bottom})`) .call(d3.axisBottom(xScale)) let yAxis = g => g.attr("class", "yAxis") .attr('transform', `translate(${margin.left}, 0)`) .call(d3.axisLeft(yScale)) target.selectAll('circle') .data(data) .enter().append('circle') .attr('r', 3) .attr('cx', d => xScale(d[col_1])) .attr('cy', d => yScale(d[col_2])); target.append('g') .call(xAxis); target.append('g') .call(yAxis); target.append("text") .attr("text-anchor", "middle") .attr("transform", "translate("+ (margin.left/3) +","+(margin.height/2)+")rotate(-90)") .text(col_2); target.append("text") .attr("text-anchor", "middle") .attr("transform", "translate("+ (margin.width/2) +","+(margin.height-(margin.bottom/3))+")") // centre below axis .text(col_1); }33:[] 2e:{"title":"webgen","cells":[{"id":265,"value":"md`# webgen\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":270,"value":"md`\n## Visualizations\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":278,"value":"md`\n### Iris data\n#### d3 scatterplot\nI started by using d3 to create a simple scatter plot. Over time, I added some features, including selection boxes for dynamically changing which attributes of the iris data are plotted\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1195,"value":"iris_data = require(\"@observablehq/iris\") ;","pinned":false,"hidden":false,"mode":"ojs"},{"id":1250,"value":"viewof yy = select({\n options: Object.keys(iris_data[0]),\n value: Object.keys(iris_data[0])[0]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1261,"value":"viewof xx = select({\n options: Object.keys(iris_data[0]),\n value: Object.keys(iris_data[0])[1]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":241,"value":"\n{\n let margin = ({\n left: 50,\n bottom: 50,\n right: 30,\n top: 30,\n height: 400,\n width: 500\n });\n \n const svg = d3.select(DOM.svg(margin.width,\n margin.height))\n .classed('chart', true);\n scatterPlot(svg,\n iris_data,\n margin,xx,yy);\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":281,"value":"md`\n### GDC data\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1517,"value":"md` Let's get all of the project data from GDC. I'm using a helper function that I wrote in order to make these queries a bit more readable.\n\\`\\`\\`javascript\nbetterFetch(url,body)\n\\`\\`\\`\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1508,"value":"projectData = {\n let url = 'https://api.gdc.cancer.gov/projects'\n let body = ({\n 'fields': \"disease_type,name,program.name,project_id,summary.case_count\",\n 'from': 0,\n 'size': 1000\n })\n return(await betterFetch(url,body))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1519,"value":"md` We use another helper function in order to extract plottable data.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1511,"value":"caseCounts = getCaseCounts(projectData)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1687,"value":"md`Using plotly, we can make a pie chart showing # of cases by project`","pinned":true,"hidden":false,"mode":"ojs"},{"id":1514,"value":"{\n let plotData = {\n labels: caseCounts.map(x=>x[\"label\"]),\n values: caseCounts.map(x=>x[\"y\"]),\n type: 'pie',\n }\n \n let layout = {\n autosize:true\n }\n const div = DOM.element('div')\n Plotly.newPlot(div, [plotData],layout);\n return div\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1505,"value":"md`\n#### plotly plots (files endpoint)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1372,"value":"md`Let's get all of the files from the TCGA pancreas project \"PAAD\".`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1184,"value":"fileData = {\n let url = 'https://api.gdc.cancer.gov/files'\n let body = ({\n 'filters':{\n \"op\":\"and\",\n \"content\":[{\n \"op\":\"in\",\n \"content\":{\n \"field\":\"cases.project.project_id\",\n \"value\":[\"TCGA-PAAD\"]\n }\n },{\n \"op\":\"in\",\n \"content\":{\n \"field\":\"access\",\n \"value\":[\"open\"]\n }\n }]\n },\n //'fields': \"data_type,file_name,file_id,data_category,type,experimental_strategy\",\n 'from': 0,\n 'size': 10000\n })\n return(await betterFetch(url,body))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1528,"value":"md` To help make histograms, I wrote another helper fucntion\n\\`\\`\\`javascript\ngetSortedHistData(vector_of_strings)\n\\`\\`\\`\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1165,"value":"histData = getSortedHistData(fileData.data.hits.map(x=>x.data_type))","pinned":false,"hidden":false,"mode":"ojs"},{"id":758,"value":"{\n let plotData = {\n x: Object.keys(histData),\n y: Object.keys(histData).map(x=>histData[x]),\n type: 'bar',\n }\n \n let layout = {\n autosize:false,\n width:600,\n height:400,\n margin:{\n l:50,\n r:200,\n b:200,\n t:25,\n pad:4\n },\n }\n \n const div = DOM.element('div')\n Plotly.newPlot(div, [plotData],layout);\n return div\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1159,"value":"{ \n let plotData = {\n labels: Object.keys(histData),\n values: Object.keys(histData).map(x=>histData[x]),\n type: 'pie',\n }\n \n const div = DOM.element('div')\n Plotly.newPlot(div, [plotData]);\n return div\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1374,"value":"md` We are interested in somatic mutations, so let's get each of the somatic mutation files across the entire GDC. Notice that this takes a while, because i've learned a new trick-- asking for fields which aren't associeted with this endpoint. \\`\\`\\` 'fields': \"...,cases.case_id,...\" \\`\\`\\` for these MAF files, which reference many cases at once, their objects now contian rather large 'cases' fields. I don't actually use the data, but I'm leaving it here for future reference.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1330,"value":"mafFileData = {\n let url = 'https://api.gdc.cancer.gov/files'\n let body = ({\n 'filters':{\n \"op\":\"and\",\n \"content\":[{\n \"op\":\"in\",\n \"content\":{\n \"field\":\"access\",\n \"value\":[\"open\"]\n }\n },{\n \"op\":\"in\",\n \"content\":{\n \"field\":\"data_category\",\n \"value\":[\"Simple Nucleotide Variation\"]\n }\n }]\n },\n 'fields': \"cases.case_id,cases.project.project_id,data_type,file_name,file_id,data_category,type,experimental_strategy\",\n 'from': 0,\n 'size': 1000\n })\n return(await betterFetch(url,body))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1689,"value":"md`I wrote a 2d histogram fucntion to help with this, although i don't really use it fully.`","pinned":true,"hidden":false,"mode":"ojs"},{"id":1340,"value":"mafHistData = {\n let hitdata = mafFileData.data.hits.map(x=>{\n let y = x.file_name\n let z = y.split(\".\")\n return([z[1],z[2]])\n })\n let histData={}\n hitdata.map(x=>{\n if(!histData[x[0]]){\n histData[x[0]]={}\n }\n if(!histData[x[0]][x[1]]){\n histData[x[0]][x[1]]=0\n }\n histData[x[0]][x[1]]+=1\n })\n return(histData)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1376,"value":"{\n let plotData = {\n x: Object.keys(mafHistData),\n y: Object.keys(mafHistData).map(x => {\n let y = mafHistData[x]\n return(Object.keys(y).length)\n }),\n type: 'bar',\n }\n\n let layout = {\n autosize:false,\n width:800,\n height:250,\n margin:{\n l:50,\n r:200,\n b:100,\n t:25,\n pad:4\n },\n }\n\n const div = DOM.element('div')\n Plotly.newPlot(div, [plotData],layout);\n return div\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1503,"value":"md` As we can see, there are four somatic mutation, a.k.a MAF, files for each tumor type... in TCGA at least.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1483,"value":"md`#### plotly bar (cases)`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1410,"value":"md`It's obvious from that first plot that the FM-AD cases are the largest group, but they're not broken down by tumor type like the TCGA projects are. (Nor do they have MAF files?). Next we query all the case data (which takes much longer than the higher level project endpoint.)`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1402,"value":"FMCaseData = {\n let url = 'https://api.gdc.cancer.gov/cases'\n let body = ({\n 'filters':{\n \"op\":\"and\",\n \"content\":[{\n \"op\":\"in\",\n \"content\":{\n \"field\":\"cases.project.project_id\",\n \"value\":[\"FM-AD\"]\n }\n },{\n \"op\":\"in\",\n \"content\":{\n \"field\":\"cases.project.project_id\",\n \"value\":[\"FM-AD\"]\n }\n }]\n },\n //'fields': \"data_type,file_name,file_id,data_category,type,experimental_strategy\",\n 'from': 0,\n 'size': 20000\n })\n return(await betterFetch(url,body))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1415,"value":"FMCaseHistData = getSortedHistData(FMCaseData.data.hits.map(x=>x.primary_site))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1419,"value":"{ \n let plotData = {\n x: Object.keys(FMCaseHistData),\n y: Object.keys(FMCaseHistData).map(x=>FMCaseHistData[x]),\n type: 'bar',\n }\n \n let layout = {\n autosize:true,\n width:800,\n height:400,\n margin:{\n l:50,\n r:50,\n b:250,\n t:50,\n },\n }\n const div = DOM.element('div')\n Plotly.newPlot(div, [plotData],layout);\n return div\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1572,"value":"md`This is great, but what data are open access for the FM-AD project?`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1556,"value":"FMFileData = {\n let url = 'https://api.gdc.cancer.gov/files'\n let body = ({\n 'filters':{\n \"op\":\"and\",\n \"content\":[{\n \"op\":\"in\",\n \"content\":{\n \"field\":\"cases.project.project_id\",\n \"value\":[\"FM-AD\"]\n }\n },{\n \"op\":\"in\",\n \"content\":{\n \"field\":\"access\",\n \"value\":[\"open\"]\n }\n }]\n },\n 'from': 0,\n 'size': 1000\n })\n return(await betterFetch(url,body))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1561,"value":"FMFileHistData = getSortedHistData(FMFileData.data.hits.map(x=>x.data_type))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1563,"value":"{ \n let plotData = {\n x: Object.keys(FMFileHistData),\n y: Object.keys(FMFileHistData).map(x=>FMFileHistData[x]),\n type: 'bar',\n }\n \n let layout = {\n autosize:true,\n width:400,\n height:300,\n margin:{\n l:50,\n r:50,\n b:50,\n t:50,\n },\n }\n const div = DOM.element('div')\n Plotly.newPlot(div, [plotData],layout);\n return div\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1673,"value":"md`There isn't much for FM-AD, but what about the others? For the non-TCGA projects, what files are actually available at all?`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1613,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":1675,"value":"{ let layout = {\n autosize:true,\n width:600,\n height:400,\n margin:{l:50,r:100,b:150,t:50},\n barmode:'stack',\n }\n const div = DOM.element('div')\n Plotly.newPlot(div, otherDataFiles,layout);\n return div\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1729,"value":"md`As a summary, here are the number of cases included in the somatic mutation data, broken down by each (TCGA) project`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1691,"value":"{let histData = []\nmafFileData.data.hits.forEach(function(thisfile){\n if (/mutect/.test(thisfile.file_name)) {\n let goodLabel = thisfile.file_name.split(\".\") \n goodLabel = goodLabel[1]\n histData[goodLabel]=thisfile.cases.length}\n }\n)\n\n let histSorted = Object.keys(histData)\n .sort(function(a,b){return histData[b]-histData[a]})\n .reduce(function (acc, key) { \n acc[key] = histData[key];\n return acc;\n }, {})\n \n let plotData = {\n x: Object.keys(histSorted),\n y: Object.keys(histSorted).map(x=>histSorted[x]),\n type: 'bar',\n }\n\n const div = DOM.element('div')\n Plotly.newPlot(div, [plotData]);\n return div\n\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1889,"value":"md`## Firebrowse`","pinned":true,"hidden":false,"mode":"ojs"},{"id":1894,"value":"PAAD_expression_x = {\n let queryJSON = {\n format: 'json',\n gene: xgene,\n cohort: 'PAAD',\n page: 1,\n page_size: 183,\n sort_by: 'tcga_participant_barcode'\n }\n let hosturl = 'https://firebrowse.herokuapp.com'\n let endpointurl='http://firebrowse.org/api/v1/Samples/mRNASeq'\n return (await fetch(hosturl +'?'+endpointurl +'?' + jq.param(queryJSON))).json()\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1953,"value":"PAAD_expression_y = {\n let queryJSON = {\n format: 'json',\n gene: ygene,\n cohort: 'PAAD',\n page: 1,\n page_size: 183,\n sort_by: 'tcga_participant_barcode'\n }\n let hosturl = 'https://firebrowse.herokuapp.com'\n let endpointurl='http://firebrowse.org/api/v1/Samples/mRNASeq'\n return (await fetch(hosturl +'?'+endpointurl +'?' + jq.param(queryJSON))).json()\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1917,"value":"PAAD_clinical = {\n let queryJSON = {\n format: 'json',\n cohort: 'PAAD',\n page: 1,\n page_size: 183,\n sort_by: 'tcga_participant_barcode'\n }\n let hosturl = 'https://firebrowse.herokuapp.com'\n let endpointurl='http://firebrowse.org/api/v1/Samples/Clinical_FH'\n return (await fetch(hosturl +'?'+endpointurl +'?' + jq.param(queryJSON))).json()\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1921,"value":"PAAD_MAF = {\n let queryJSON = {\n format: 'json',\n cohort: 'PAAD',\n gene: 'KRAS',\n page: 1,\n page_size: 300,\n sort_by: 'tcga_participant_barcode'\n }\n let hosturl = 'https://firebrowse.herokuapp.com'\n let endpointurl='http://firebrowse.org/api/v1/Analyses/Mutation/MAF'\n return (await fetch(hosturl +'?'+endpointurl +'?' + jq.param(queryJSON))).json()\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1931,"value":"PAAD_Gistic = {\n let queryJSON = {\n format: 'json',\n cohort: 'PAAD',\n gene: 'GATA6',\n page: 1,\n page_size: 500,\n sort_by: 'tcga_participant_barcode'\n }\n let hosturl = 'https://firebrowse.herokuapp.com'\n let endpointurl='http://firebrowse.org/api/v1/Analyses/CopyNumber/Genes/All'\n return (await fetch(hosturl +'?'+endpointurl +'?' + jq.param(queryJSON))).json()\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1976,"value":"viewof ygene = select({\n options: ['GATA6','KRAS','TFF1'],\n value: 'GATA6'\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1972,"value":"viewof xgene = select({\n options: ['GATA6','KRAS','TFF1'],\n value: 'KRAS'\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1937,"value":"{\n let plotData = {\n x: [],\n y: [],\n text: [],\n mode: 'markers',\n type: 'scatter'\n };\n PAAD_expression_x.mRNASeq.forEach(\n function(ob) {\n plotData.x.push(ob.expression_log2)\n plotData.text.push(ob.tcga_participant_barcode)\n }\n );\n PAAD_expression_y.mRNASeq.forEach(\n function(ob) {\n plotData.y.push(ob.expression_log2)\n }\n ); \n const div = DOM.element('div')\n Plotly.newPlot(div, [plotData]);\n return div\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1033,"value":"md`#### Formatted HTML (projects)`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1553,"value":"md`Forked from Jonas, this was actually the first thing we did with the project data`","pinned":false,"hidden":false,"mode":"ojs"},{"id":284,"value":"PrintTCGA(projectData)","pinned":false,"hidden":false,"mode":"ojs"},{"id":263,"value":"md`\n## Methods\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":261,"value":"md` ### Fetching project data\nBelow, I use 2 different ways to fetch all of the project data. First, by writing an ugly url, then by creating an object that we can send to a fucntion.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":91,"value":"projectData_ugly=(await fetch('https://api.gdc.cancer.gov/projects?fields=disease_type,name,program.name,project_id,summary.case_count&from=0&size=1000&sort=disease_type:asc')).json()","pinned":true,"hidden":false,"mode":"ojs"},{"id":972,"value":"md`Now try to make it a function`","pinned":false,"hidden":false,"mode":"ojs"},{"id":977,"value":"betterFetch = async function(url,body) {\n let fetchData = { \n method: 'POST', \n body: JSON.stringify(body),\n headers:{'Content-Type':'application/json'}\n }\n let tmpData=(await fetch(url, fetchData)).json()\n return(tmpData)\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1199,"value":"md` Example prettier use case:\n\\`\\`\\`javascript\nprojectData = {\n let url = 'https://api.gdc.cancer.gov/projects'\n let body = ({\n 'fields': \"disease_type,name,program.name,project_id,summary.case_count\",\n 'from': 0,\n 'size': 1000\n })\n return(await betterFetch(url,body))\n}\n\\`\\`\\`\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1306,"value":"md` for examples of fields: https://api.gdc.cancer.gov/files/_mapping`","pinned":false,"hidden":false,"mode":"ojs"},{"id":784,"value":"md` #### post-processing of results\nExtract the number of cases from our retrieved project object in order to make it more plot-friendly\n\\`\\`\\`javascript\ncaseCounts = getCaseCounts(projectData)\n\\`\\`\\`\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1051,"value":"\ngetCaseCounts = function(projectData) {\n let caseCounts=[];\n projectData.data.hits.forEach(function(prj,i){\n // for each hit (project)\n caseCounts = caseCounts.concat({\n \"label\" : prj.id,\n \"y\" : prj.summary.case_count,})\n })\n return caseCounts\n};","pinned":false,"hidden":false,"mode":"ojs"},{"id":1470,"value":"md` This function returns a sorted histogram object that is suitable for plotting. It expects a vector of strings, such as that provided by :\n\\`\\`\\`javascript\nhistData = getSortedHistData(fileData.data.hits.map(x=>x.data_type))\n\\`\\`\\`\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1467,"value":"getSortedHistData = function(hitdata) {\n let histData={}\n hitdata.map(x=>{\n if(!histData[x]){\n histData[x]=0\n }\n histData[x]+=1\n })\n let histSorted = Object.keys(histData)\n .sort(function(a,b){return histData[b]-histData[a]})\n .reduce(function (acc, key) { \n acc[key] = histData[key];\n return acc;\n }, {})\n return(histSorted)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":792,"value":"md` ### Plotting methods\n#### html\nMethod to print project data out a bulleted list\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":787,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":245,"value":"md` ### d3 Plotting\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":53,"value":"d3 = require(\"d3\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":1109,"value":"md`use d3 to create a versatile 2d scatter plot`","pinned":false,"hidden":false,"mode":"ojs"},{"id":174,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":307,"value":"md` ### plotly\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":654,"value":"Plotly = require(\"https://cdn.plot.ly/plotly-latest.min.js\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":834,"value":"md`## other peoples' libraries\n\nhttps://gdc.cancer.gov/developers/gdc-user-interface-ui-library\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":813,"value":"require('@oncojs/lolliplot')\n","pinned":true,"hidden":false,"mode":"ojs"},{"id":818,"value":"require('@oncojs/sapien')\n","pinned":true,"hidden":false,"mode":"ojs"},{"id":1247,"value":"import {slider} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1256,"value":"import {select} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1752,"value":"md`## require from github\n\nhttps://observablehq.com/@mbostock/require-from-github\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1788,"value":"md`### firebrowse\nhttps://observablehq.com/@episphere/firebrowse`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1755,"value":"fb =\n {\n const response = await fetch(\"https://raw.githubusercontent.com\"\n + \"/episphere/firebrowse/master/firebrowse.js\");\n const blob = await response.blob();\n return require(URL.createObjectURL(blob)).catch(() => window.firebrowse);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1768,"value":"fb.created_at","pinned":true,"hidden":false,"mode":"ojs"},{"id":1826,"value":"fb.get()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1877,"value":"md`# Get data from firebrowse`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1799,"value":"hosturl = 'https://firebrowse.herokuapp.com'","pinned":false,"hidden":false,"mode":"ojs"},{"id":1780,"value":"endpointurl='http://firebrowse.org/api/v1/Samples/mRNASeq'","pinned":false,"hidden":false,"mode":"ojs"},{"id":1822,"value":"queryJSON = {\n let queryJSON = {\n format: 'json',\n gene: 'PSCA',\n cohort: 'BLCA',\n protocol: 'RSEM',\n page: 1,\n page_size: 250,\n sort_by: 'cohort'\n }\nreturn queryJSON\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1866,"value":"jq = require(\"https://code.jquery.com/jquery-3.4.1.js\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":1864,"value":"queryurl =jq.param(queryJSON)","pinned":true,"hidden":false,"mode":"ojs"},{"id":1795,"value":"(await fetch(hosturl +'?'+endpointurl +'?' + queryurl)).json()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1862,"value":"(await fetch(endpointurl +'?' + queryurl)).json()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1845,"value":"(await fb.get(endpointurl +'?' + queryurl)).json()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1857,"value":"betterFetch(hosturl+'?'+endpointurl,queryJSON)","pinned":true,"hidden":false,"mode":"ojs"},{"id":770,"value":"md` ## miscellanea\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1208,"value":"md`## notes for class\n### GenomicDataCommons R-Package \n[biorxiv publication](https://www.biorxiv.org/content/biorxiv/early/2017/04/04/117200.full.pdf)
\n[documentation](https://bioconductor.org/packages/release/bioc/vignettes/GenomicDataCommons/inst/doc/overview.html)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":405,"value":"md`\n### a code block\n\\`\\`\\`javascript\n{ const fac = (x) =>\n (x<=1)? 1 : x * fac(x-1)\n return(fac(6))\n}\n\\`\\`\\`\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":471,"value":"md`\n### some latex\n${tex.block`\nf(\\textcolor{hotpink}{x}) = \\int_{-\\infty}^\\infty\n \\hat f(\\xi)\\,e^{2 \\pi i \\xi \\textcolor{hotpink}{x}}\n \\,d\\xi\n`}\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":533,"value":"md`\n### inline code \\n\nThis is the function call I am going to make: \n\\`\\`\\`javascript\nfactorial(5)\n\\`\\`\\`\n... and the result is here: ${factorial(5)} , right in the middle of my text\n`","pinned":true,"hidden":false,"mode":"ojs"},{"id":460,"value":"factorial = (x) => {\n let _fac = (x) => {\n return (x<=1)? 1 : x * _fac(x-1)\n }\n return(_fac(x))\n }","pinned":false,"hidden":false,"mode":"ojs"},{"id":934,"value":"md`### Importing`","pinned":false,"hidden":false,"mode":"ojs"},{"id":931,"value":"import {plotRichard} from '@jonasalmeida/webgen'","pinned":false,"hidden":false,"mode":"ojs"},{"id":1205,"value":"md`### embedding`","pinned":false,"hidden":false,"mode":"ojs"},{"id":865,"value":"md`embedding a reactive plot inside of markdown? \n${await plotRichard(['lala','lele'],[4,5],'bar','Richard Plot Demo')}\n... came back as a promise until i await it . . . \n`","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}