31:Ta52,cell_layer = new deck.ScatterplotLayer({ id: 'cell_layer', data: cell_data, getPosition: apply_map_morph, getFillColor: d => { var inst_color if (select_meta === 'none'){ inst_color = [50, 50, 50, 100] } else if (select_meta === 'leiden'){ if (selected_leidens.length === 0){ // single leiden var rgb = d3.color(cat_colors[d[select_meta]]) inst_color = [rgb.r, rgb.g, rgb.b, 255 * cat_opacity] } else { // multiple leidens if (selected_leidens.includes(d['leiden'])){ var rgb = d3.color(cat_colors[d[select_meta]]) inst_color = [rgb.r, rgb.g, rgb.b, 255 * cat_opacity] } else { inst_color = [50, 50, 50, 10] } } } else if (select_meta === 'mean-gene'){ // mean of multiple genes var inst_opacity = mean_opacity_scale(parseInt(mean_gene_data[d['name']]['mean-gene'])) if (inst_opacity > 0){ inst_color = [255, 0, 0, inst_opacity] } else { inst_color = [50, 50, 50, 10] } } else { // single gene var inst_opacity = opacity_scale(parseInt(gene_data[d['name']][select_meta])) if (inst_opacity > 0){ inst_color = [255, 0, 0, inst_opacity] } else { inst_color = [50, 50, 50, 10] } } return inst_color }, getRadius: radius, pickable: is_pickable, highlightColor: d => [50, 50, 50], radiusMinPixels: radius_min_pixels, updateTriggers: { getFillColor: [select_meta, selected_leidens, mean_gene_data], getPosition: map_type }, transitions: transitions, onClick: (info, event) => { if (mutable selected_leidens[0] !== info.object.leiden){ mutable select_meta = 'leiden' mutable selected_leidens = [info.object.leiden] } else { mutable select_meta = 'leiden' mutable selected_leidens = [] } // if (d3.select('#meta_dropdown').select('select').node().value !== info.object.name){ // mutable select_meta = info.object.name // d3.select('#meta_dropdown').select('select').node().value = info.object.name // } else { // mutable select_meta = 'leiden' // d3.select('#meta_dropdown').select('select').node().value = 'leiden' // } } }) 32:T4cc,transcript_layer = new deck.ScatterplotLayer({ id: 'transcript_layer', data: transcript_data, pickable: is_pickable, // getPosition: d => [d.x, - d.y], getPosition: d => d.position, getFillColor: d => { var color if (map_type === 'Spatial'){ color = d.color } else { color = [0, 0, 0, 0] } return color }, getRadius: 0.25, radiusMinPixels: 0.5, // opacity: d => { // var opacity // if (map_type === 'Spatial'){ // opacity = 0.5 // } else { // opacity = 0.0 // } // return opacity // }, pickable: true, visible: visible_transcripts, updateTriggers: { getFillColor: map_type, }, onClick: (info, event) => { if (d3.select('#meta_dropdown').select('select').node().value !== info.object.name){ mutable select_meta = info.object.name d3.select('#meta_dropdown').select('select').node().value = info.object.name } else { mutable select_meta = 'leiden' d3.select('#meta_dropdown').select('select').node().value = 'leiden' } } })33:T608,function debounce(func, wait, immediate) { // 'private' variable for instance // The returned function will be able to reference this due to closure. // Each call to the returned function will share this common timer. var timeout; // Calling debounce returns a new anonymous function return function() { // reference the context and args for the setTimeout function var context = this, args = arguments; // Should the function be called now? If immediate is true // and not already in a timeout then the answer is: Yes var callNow = immediate && !timeout; // This is the basic debounce behaviour where you can call this // function several times, but it will only execute once // [before or after imposing a delay]. // Each time the returned function is called, the timer starts over. clearTimeout(timeout); // Set the new timeout timeout = setTimeout(function() { // Inside the timeout function, clear the timeout variable // which will let the next execution run when in 'immediate' mode timeout = null; // Check if the function already ran with the immediate flag if (!immediate) { // Call the original function with apply // apply lets you define the 'this' object as well as the arguments // (both captured before setTimeout) func.apply(context, args); } }, wait); // Immediate mode and no wait timer? Execute the function.. if (callNow) func.apply(context, args); } } 34:T4d1,viewof map_type = { const element = html`

`; d3.select(element) .style('padding-right', '25px') .selectAll('div') .data(['UMAP', 'Spatial']) .join('span') .on('click', function(d){ // clear fovs when switching map types to prevent // fovs from UMAP view propagating to Spatial view and // causing many requests for FOV transcripts and cell polygons mutable fovs = [] d3.select(element).selectAll('span') .style('color', '#808080') d3.select(this) .style('color', 'blue') element.value = d.replace(', ', '') element.dispatchEvent(new CustomEvent("input")); }) .style('min-width', '200px') .style('max-width', '200px') .style('margin-right', '10px') .text(d => d) .style('font-weight', '550px') .style("font-family", "sans-serif") .style("font-size", "16") .style("text-anchor", "end") .style('font-weight', 'bold') .style('color', d => d === 'UMAP' ? 'blue': '#808080') .attr('id', d => d) element.value = ini_map_type element.dispatchEvent(new CustomEvent("input")) return element }35:T6d8,viewof cgm = { // Clustergrammer-GL uses query selectors to re-find the container, so if we // might want multiple instances of Clustergrammer-GL on the page, they’ll // need unique identifiers! (It’d be better if Clustergrammer-GL used // element.querySelector instead of document.querySelector and didn’t dependf // on these identifiers.) const containerId = DOM.uid("container"); const container = html`

`; // Clustergrammer-GL depends on the container having been inserted into the // document before it’s initialized. We can do this by yielding! However, // since we’re defining this cell as a view, we don’t want the view’s value // to resolve until CGM has initialized. Hence we define the view’s value as // a promise that resolves immediately after. We could simplify this if // Clustergrammer-GL allowed you to pass in a detached container. let resolve; container.value = new Promise(r => resolve = r); yield container; // Initialize CGM. // (We might want to use Observable’s reactive width here?) const cgm = CGM({ network, viz_width: 900, viz_height: 900, container }); // Redefine the order parameters as getters and setters, so that we can intercept // when these change and emit an event. That will allow other cells to listen for // these changes are react accordingly. Object.defineProperties(cgm.params.order.new, { row: reactiveValue(container, "row", cgm.params.order.new.row), col: reactiveValue(container, "col", cgm.params.order.new.col) }); // Resolve the view’s value so that downstream cells can run. resolve(cgm); d3.select('.row_search_container').remove() }36:[{"id":"7d6cecc3bad2ffc762b6a03b9f88ecb2a89dc2073195325a3eadb957a7f9cf8948047e657716fca537b05105f550fefd6203135db3045e9d12497f72efa65b58","href":"https://static.observableusercontent.com/files/7d6cecc3bad2ffc762b6a03b9f88ecb2a89dc2073195325a3eadb957a7f9cf8948047e657716fca537b05105f550fefd6203135db3045e9d12497f72efa65b58","name":"clustergrammer-gl@1.0.22.0.packd.js","type":"application/javascript","lastModified":1628701245997.887,"size":1028473}] 2f:{"title":"Cells and Heatmap Jupyter","cells":[{"id":0,"value":"md`# Cells and Heatmap Jupyter`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1670,"value":"## Zip Data","pinned":true,"hidden":false,"mode":"md"},{"id":1681,"value":"number_of_genes = Object.keys(unzip_json).length","pinned":true,"hidden":false,"mode":"ojs"},{"id":1679,"value":"unzip_json = JSON.parse(decode_zipped_string(zip_string))","pinned":true,"hidden":false,"mode":"ojs"},{"id":1677,"value":"zip_string = 'eJyrVspLLdfNTq1UslIAM8sSc0pTlWoBZN4ILw=='","pinned":true,"hidden":false,"mode":"ojs"},{"id":1675,"value":"function decode_zipped_string(b64Data){\n // Get some base64 encoded binary data from the server. Imagine we got this:\n \n // Decode base64 (convert ascii to binary)\n var strData = atob(b64Data);\n \n // Convert binary string to character-number array\n var charData = strData.split('').map(function(x){return x.charCodeAt(0);});\n \n // Turn number array into byte-array\n var binData = new Uint8Array(charData);\n \n // Pako magic\n var data = pako.inflate(binData);\n \n // // Convert gunzipped byteArray back to ascii string:\n // var strData = String.fromCharCode.apply(null, new Uint16Array(data));\n\n // https://stackoverflow.com/questions/8936984/uint8array-to-string-in-javascript\n var strData = new TextDecoder().decode(data);\n \n // Output to console\n // console.log(strData); \n return strData\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1673,"value":"pako = require('pako/dist/pako.min.js')","pinned":true,"hidden":false,"mode":"ojs"},{"id":763,"value":"dashboard = html`\n

${viewof map_type}

${viewof select_meta_dropdown}

\n \n

\n\n \n

${container}

${viewof cgm}

\n\n

\n` \n","pinned":true,"hidden":false,"mode":"ojs"},{"id":1571,"value":"## Dendro Selected Genes","pinned":false,"hidden":false,"mode":"md"},{"id":1391,"value":"mean_gene_data_ini = {\n // selected dendro genes\n ///////////////////////////////\n var mean_gene_data_ini = {}\n promised_selected_genes.forEach((x, i) => {\n \n if (i === 0){\n // initialize gene_data after getting promised gene data (after dendrogram click)\n cell_data.forEach((x,i) => {\n mean_gene_data_ini[i] = ({\n '': i, \n 'mean-gene': 0\n }) \n }) \n }\n\n \n \n const gene_name = dendro_selected_genes[i]\n\n // var sum_gene = d3.sum(x, d => d[gene_name])\n \n x.forEach((cell_obj, cell_index) => {\n mean_gene_data_ini[cell_index]['mean-gene'] = mean_gene_data_ini[cell_index]['mean-gene'] + cell_obj[gene_name] // /sum_gene\n })\n })\n\n return mean_gene_data_ini\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1418,"value":"mean_gene_data = Object.keys(mean_gene_data_ini).map(x => mean_gene_data_ini[x])","pinned":true,"hidden":false,"mode":"ojs"},{"id":774,"value":"viewof select_meta_dropdown = select({'options':['none'].concat(meta_data_cols), value: ini_cat})","pinned":true,"hidden":false,"mode":"ojs"},{"id":1130,"value":"mutable select_meta = select_meta_dropdown","pinned":true,"hidden":false,"mode":"ojs"},{"id":1135,"value":"select_meta_dropdown","pinned":true,"hidden":false,"mode":"ojs"},{"id":777,"value":"ini_cat = inputs['ini_cat']","pinned":true,"hidden":false,"mode":"ojs"},{"id":1639,"value":"promised_selected_genes","pinned":true,"hidden":false,"mode":"ojs"},{"id":82,"value":"container = html `

`","pinned":true,"hidden":false,"mode":"ojs"},{"id":1651,"value":"cat_colors","pinned":true,"hidden":false,"mode":"ojs"},{"id":452,"value":"# Data","pinned":false,"hidden":false,"mode":"md"},{"id":1659,"value":"## GEX Dic Zip","pinned":true,"hidden":false,"mode":"md"},{"id":675,"value":"promised_data","pinned":true,"hidden":false,"mode":"ojs"},{"id":466,"value":"transcript_data_ini = [].concat.apply([], promised_data)","pinned":true,"hidden":false,"mode":"ojs"},{"id":689,"value":"// transcript_data_chunks = promised_data.map(x => \n// x.map(x => ({\n// '': x[''],\n// 'barcode_id': x.barcode_id,\n// 'position': eval(x.position),\n// 'color': eval(x.color), \n// })))","pinned":true,"hidden":false,"mode":"ojs"},{"id":1094,"value":"select_meta","pinned":true,"hidden":false,"mode":"ojs"},{"id":632,"value":"transcript_data = transcript_data_ini.map(x => {\n var new_obj\n\n var inst_gene = barcode_id_gene_dictionary[x.barcode_id]\n\n // allow transcript color filtering\n if (['leiden', 'none'].includes(select_meta)){\n new_obj = ({\n '': x[''],\n 'name': inst_gene,\n 'barcode_id': x.barcode_id,\n 'position': eval(x.position),\n 'color': eval(x.color), \n 'tooltip_name': inst_gene\n })\n } else {\n var inst_color = [0, 0, 0, 15]\n\n // check gene name\n if (inst_gene === select_meta || dendro_selected_genes.includes(inst_gene)){\n inst_color = eval(x.color)\n }\n \n new_obj = ({\n '': x[''],\n 'barcode_id': x.barcode_id,\n 'name': inst_gene,\n 'position': eval(x.position),\n 'color': inst_color, \n 'tooltip_name': inst_gene\n }) \n \n }\n return new_obj\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":464,"value":"promised_data = Promise.all(fovs.map(fov => { \n \n const url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/transcripts_csv_zip_round_colors/' +\n String(fov) + '.csv.zip'\n\n var unzipped_csv \n if (map_type === 'Spatial'){\n unzipped_csv = load_zip_csv(url) \n } else {\n unzipped_csv = []\n } \n \n return unzipped_csv\n}))","pinned":true,"hidden":false,"mode":"ojs"},{"id":503,"value":"cell_data = inputs['data'].map(x => {\n x.tooltip_name = 'Leiden-' + x.leiden\n return x\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":1298,"value":"// cell_data = cell_data_ini.map(x => {\n// x.name = 'Leiden-' + x.leiden\n// return x\n// })","pinned":true,"hidden":false,"mode":"ojs"},{"id":505,"value":"cat_colors = inputs['cat_colors']","pinned":true,"hidden":false,"mode":"ojs"},{"id":501,"value":"inputs = FileAttachment(\"observable_inputs_slice-1_replicate-2.json\").json()","pinned":true,"hidden":false,"mode":"ojs"},{"id":448,"value":"# Deck.gl","pinned":false,"hidden":false,"mode":"md"},{"id":1202,"value":"selected_leidens.length","pinned":true,"hidden":false,"mode":"ojs"},{"id":1220,"value":"cell_data[0]","pinned":true,"hidden":false,"mode":"ojs"},{"id":512,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":546,"value":"radius = 2","pinned":true,"hidden":false,"mode":"ojs"},{"id":524,"value":"// map_type = 'Spatial'","pinned":true,"hidden":false,"mode":"ojs"},{"id":548,"value":"radius_min_pixels = 1.5","pinned":true,"hidden":false,"mode":"ojs"},{"id":552,"value":"transitionDuration = 3000","pinned":true,"hidden":false,"mode":"ojs"},{"id":520,"value":"transitions = ({\n getPosition: {\n duration:transitionDuration,\n easing: d3.easeCubic\n }\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":522,"value":"// have deck.gl animate\nfunction apply_map_morph(d){ \n var inst_x\n var inst_y\n if (map_type === 'Spatial'){\n inst_x = d.x\n inst_y = -d.y\n } else {\n inst_x = umap_x_scale(d['umap-x'])\n inst_y = - umap_y_scale(d['umap-y'])\n }\n return [inst_x, inst_y]\n} ","pinned":true,"hidden":false,"mode":"ojs"},{"id":526,"value":"umap_x_scale = d3.scaleLinear()\n .domain([umap_x_min, umap_x_max])\n .range([x_min, x_max]);","pinned":true,"hidden":false,"mode":"ojs"},{"id":528,"value":"umap_y_scale = d3.scaleLinear()\n .domain([umap_y_min, umap_y_max])\n .range([y_min, y_max]);","pinned":true,"hidden":false,"mode":"ojs"},{"id":542,"value":"x_min = Math.min.apply(Math, cell_data.map(function(o) { return parseFloat(o['x']) }))","pinned":true,"hidden":false,"mode":"ojs"},{"id":530,"value":"x_max = Math.max.apply(Math, cell_data.map(function(o) { return parseFloat(o['x']) }))","pinned":true,"hidden":false,"mode":"ojs"},{"id":532,"value":"y_min = Math.min.apply(Math, cell_data.map(function(o) { return parseFloat(o['y']) }))","pinned":true,"hidden":false,"mode":"ojs"},{"id":544,"value":"y_max = Math.max.apply(Math, cell_data.map(function(o) { return parseFloat(o['y']) }))","pinned":true,"hidden":false,"mode":"ojs"},{"id":534,"value":"umap_x_min = Math.min.apply(Math, cell_data.map(function(o) { return parseFloat(o['umap-x']) }))","pinned":true,"hidden":false,"mode":"ojs"},{"id":536,"value":"umap_x_max = Math.max.apply(Math, cell_data.map(function(o) { return parseFloat(o['umap-x']) }))","pinned":true,"hidden":false,"mode":"ojs"},{"id":538,"value":"umap_y_min = Math.min.apply(Math, cell_data.map(function(o) { return parseFloat(o['umap-y']) }))","pinned":true,"hidden":false,"mode":"ojs"},{"id":540,"value":"umap_y_max = Math.max.apply(Math, cell_data.map(function(o) { return parseFloat(o['umap-y']) }))","pinned":true,"hidden":false,"mode":"ojs"},{"id":291,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":704,"value":"mutable visible_transcripts = false","pinned":true,"hidden":false,"mode":"ojs"},{"id":307,"value":"layers = [cell_layer, polygon_layer, transcript_layer] \n// layers = [polygon_layer] ","pinned":true,"hidden":false,"mode":"ojs"},{"id":427,"value":"is_pickable = true","pinned":true,"hidden":false,"mode":"ojs"},{"id":300,"value":"deckgl.setProps({layers: layers});","pinned":true,"hidden":false,"mode":"ojs"},{"id":373,"value":"view = new deck.OrthographicView({id: 'ortho'})","pinned":true,"hidden":false,"mode":"ojs"},{"id":19,"value":"deckgl = {\n return new deck.DeckGL({\n container,\n views:[view],\n initialViewState: initial_view_state,\n // controller: true,\n controller: {doubleClickZoom: false},\n // getTooltip: ({object}) => {\n // return object && \n // `${object['name']}`\n // // `pos: ${object.x}, ${object['y']}\\n`\n // },\n getTooltip: ({object}) => object && {\n html: `${object.tooltip_name}`,\n style: {\n fontSize: '0.8em',\n padding: '5px',\n }\n },\n onViewStateChange: ({viewState}) => {\n debounced_something(viewState)\n return viewState\n },\n // onClick: ({info}) => {\n // console.log(info)\n // return info\n // }\n \n });\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":375,"value":"initial_view_state = ({\n target: [2000, 7000, 0],\n zoom: -3.5,\n minZoom: -3.75,\n maxZoom:10\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":227,"value":"md`### Variables`","pinned":false,"hidden":false,"mode":"ojs"},{"id":276,"value":"inst_zoom = 6","pinned":false,"hidden":false,"mode":"ojs"},{"id":213,"value":"inst_lat = 1","pinned":false,"hidden":false,"mode":"ojs"},{"id":204,"value":"inst_lng = 1","pinned":false,"hidden":false,"mode":"ojs"},{"id":599,"value":"height = 800","pinned":true,"hidden":false,"mode":"ojs"},{"id":559,"value":"# Fetching Functions","pinned":false,"hidden":false,"mode":"md"},{"id":1155,"value":"detail_zoom_thresh = 1.25","pinned":true,"hidden":false,"mode":"ojs"},{"id":563,"value":"function something(viewState){\n \n var height = viewState.height\n var width = viewState.width\n \n var zoom = Math.pow(2, viewState.zoom)\n if (zoom > detail_zoom_thresh){\n \n var target_x = viewState.target[0]\n var target_y = viewState.target[1]\n \n var min_x = target_x - width/(2*zoom)\n var max_x = target_x + width/(2*zoom)\n \n var min_y = target_y - height/(2*zoom)\n var max_y = target_y + height/(2*zoom)\n \n mutable fovs = cell_data\n .filter(d => d.x >= min_x)\n .filter(d => d.x < max_x)\n // y values are inverted\n .filter(d => -d.y >= min_y)\n .filter(d => -d.y < max_y)\n .map(x => x.fov)\n .filter((x, i, a) => a.indexOf(x) === i)\n\n mutable visible_transcripts = true\n \n } else {\n mutable visible_transcripts = false\n mutable fovs = []\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":833,"value":"visible_transcripts","pinned":true,"hidden":false,"mode":"ojs"},{"id":570,"value":"debounced_something = debounce(something, 250);","pinned":true,"hidden":false,"mode":"ojs"},{"id":572,"value":"$33","pinned":true,"hidden":false,"mode":"ojs"},{"id":567,"value":"mutable fovs = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":443,"value":"# Requirements","pinned":true,"hidden":false,"mode":"md"},{"id":154,"value":"deck = require.alias({\n // optional dependencies\n h3: {}\n})('deck.gl@latest/dist.min.js')","pinned":true,"hidden":false,"mode":"ojs"},{"id":312,"value":"import {text} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":460,"value":"function load_zip_csv(url) {\n\n const data = fetch(url)\n .then(x => x.arrayBuffer())\n .then(x => jszip.loadAsync(x))\n .then(buf => {\n const file = Object.keys(buf.files)[0];\n const js_array = buf.file(file)\n .async(\"string\")\n .then(x => d3.csvParse(x, d3.autoType))\n return js_array\n }) \n\n return data \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":457,"value":"jszip = require(\"jszip@3/dist/jszip.min.js\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":652,"value":"# Testing","pinned":false,"hidden":false,"mode":"md"},{"id":618,"value":"// tmp_url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/transcripts_csv_zip_round_colors/' +\n// String(100) + '.csv.zip'\n","pinned":true,"hidden":false,"mode":"ojs"},{"id":622,"value":"// load_zip_csv(tmp_url) ","pinned":true,"hidden":false,"mode":"ojs"},{"id":656,"value":"// mutable tmp1 = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":658,"value":"// tmp2 = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":660,"value":"// mutable tmp1.push(tmp2)","pinned":true,"hidden":false,"mode":"ojs"},{"id":721,"value":"polygon_layer = new deck.PolygonLayer({\n id: 'polygon_layer',\n data: cell_polygons,\n // getFillColor: [250, 0, 0],\n getLineColor: [0, 0, 0, 150],\n getLineWidth: d => 0.2,\n getPolygon: d => d.coordinates,\n stroked: true,\n filled: false,\n wireframe: true,\n pickable: true,\n lineWidthMinPixels: 0.1,\n visible: visible_transcripts,\n // opacity: rescue_opacity\n }); ","pinned":true,"hidden":false,"mode":"ojs"},{"id":663,"value":"// mutable tmp1 ","pinned":true,"hidden":false,"mode":"ojs"},{"id":749,"value":"# Cell-Level Gene","pinned":false,"hidden":false,"mode":"md"},{"id":800,"value":"data_ini = inputs['data']","pinned":true,"hidden":false,"mode":"ojs"},{"id":803,"value":"data = data_ini","pinned":true,"hidden":false,"mode":"ojs"},{"id":755,"value":"gene_data_url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/per-gene-counts_slice-1_replicate-2/' + select_meta + '.csv'","pinned":true,"hidden":false,"mode":"ojs"},{"id":1340,"value":"zip_gene_data_url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/per-gene-counts_slice-1_replicate-2_zip/' + select_meta + '.csv.zip'","pinned":true,"hidden":false,"mode":"ojs"},{"id":753,"value":"mutable gene_data = {\n var gene_data\n\n // reset gene_data\n if (['none', 'leiden', 'mean-gene'].includes(select_meta)){\n gene_data = ([{}])\n } else {\n gene_data = load_zip_csv(zip_gene_data_url) \n }\n \n return gene_data\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":757,"value":"cat_opacity = 0.9","pinned":true,"hidden":false,"mode":"ojs"},{"id":1607,"value":"mean_opacity_scale = d3.scaleLinear()\n .domain([0, mean_gene_max])\n .range([0, 250])","pinned":true,"hidden":false,"mode":"ojs"},{"id":759,"value":"opacity_scale = d3.scaleLinear()\n .domain([0, gene_max])\n .range([0, 250])","pinned":true,"hidden":false,"mode":"ojs"},{"id":761,"value":"// the maximum opacity will happen when the value reaches 90% of the maximum\ngene_max = Math.max.apply(Math, gene_data.map(function(x) { return parseInt(x[select_meta]) })) * 0.90","pinned":true,"hidden":false,"mode":"ojs"},{"id":1556,"value":"mean_gene_data","pinned":true,"hidden":false,"mode":"ojs"},{"id":1533,"value":"mean_gene_max = Math.max.apply(Math, mean_gene_data.map(function(x) { return parseInt(x['mean-gene']) })) * 0.90","pinned":true,"hidden":false,"mode":"ojs"},{"id":767,"value":"ini_map_type = 'UMAP'","pinned":true,"hidden":false,"mode":"ojs"},{"id":807,"value":"map_type","pinned":true,"hidden":false,"mode":"ojs"},{"id":1337,"value":"// load_zip_csv(zip_gene_data_url) ","pinned":true,"hidden":false,"mode":"ojs"},{"id":1011,"value":"# Cell Polygons","pinned":false,"hidden":false,"mode":"md"},{"id":880,"value":"// cell_polygon_data = Promise.all([49].map(fov => { \n \n// const url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/cell_polygons/cells_' +\n// String(fov) + '.json'\n \n// return fetch(url)\n// }))","pinned":true,"hidden":false,"mode":"ojs"},{"id":890,"value":"// response = {\n// const response = await fetch(cell_polygon_url);\n// // return {\n// // ok: response.ok,\n// // body: await response.text()\n// // };\n// return response.text()\n// }","pinned":true,"hidden":false,"mode":"ojs"},{"id":915,"value":"// cell_polygons = fetch(cell_polygon_url)\n// .then(response => response.json())\n// .then (d => d)","pinned":true,"hidden":false,"mode":"ojs"},{"id":972,"value":"// requested_fovs = [30, 98, 99]","pinned":true,"hidden":false,"mode":"ojs"},{"id":970,"value":"// available_fovs = [98, 99]","pinned":true,"hidden":false,"mode":"ojs"},{"id":967,"value":"cell_poly_fovs = fovs.filter(x => available_fovs.includes(x))","pinned":true,"hidden":false,"mode":"ojs"},{"id":933,"value":"promised_cell_polygons = Promise.all(cell_poly_fovs.map(fov => {\n const url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/cell_polygons/cells_' + fov + '.json'\n\n var cell_polygons\n if (map_type === 'Spatial'){\n cell_polygons = fetch(url)\n .then(response => response.json())\n } else {\n cell_polygons = []\n }\n\n return cell_polygons\n}))","pinned":true,"hidden":false,"mode":"ojs"},{"id":1087,"value":"barcode_id_gene_url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/barcode_id_gene_dictionary.json'","pinned":true,"hidden":false,"mode":"ojs"},{"id":1081,"value":"barcode_id_gene_dictionary = fetch(barcode_id_gene_url)\n .then(d => d.json())","pinned":true,"hidden":false,"mode":"ojs"},{"id":946,"value":"cell_polygons = [].concat.apply([], promised_cell_polygons)","pinned":true,"hidden":false,"mode":"ojs"},{"id":911,"value":"await fetch(cell_polygon_url)","pinned":true,"hidden":false,"mode":"ojs"},{"id":897,"value":"fetch(cell_polygon_url)","pinned":true,"hidden":false,"mode":"ojs"},{"id":884,"value":"cell_polygon_url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/cell_polygons/cells_99.json'","pinned":true,"hidden":false,"mode":"ojs"},{"id":886,"value":"await fetch(cell_polygon_url)","pinned":true,"hidden":false,"mode":"ojs"},{"id":976,"value":"fetch('https://raw.githubusercontent.com/cornhundred/testing_something/master/cell_polygons/available_fovs_cell_polygons.csv')\n .then(d => d)","pinned":true,"hidden":false,"mode":"ojs"},{"id":981,"value":"available_fovs_ini = d3.text('https://raw.githubusercontent.com/cornhundred/testing_something/master/cell_polygons/available_fovs_cell_polygons.csv')\n \n // .apply(x => x)","pinned":true,"hidden":false,"mode":"ojs"},{"id":994,"value":"available_fovs = d3.csvParseRows(available_fovs_ini).map(x => parseInt(x[0]))","pinned":true,"hidden":false,"mode":"ojs"},{"id":769,"value":"$34","pinned":true,"hidden":false,"mode":"ojs"},{"id":779,"value":"import {select} from '@jashkenas/inputs'","pinned":true,"hidden":false,"mode":"ojs"},{"id":782,"value":"meta_data_cols = meta_data_cols_ini.concat(gene_names)","pinned":true,"hidden":false,"mode":"ojs"},{"id":794,"value":"non_param_cols = ['x', 'y', 'umap-x', 'umap-y', 'name', 'fov', 'tooltip_name']","pinned":true,"hidden":false,"mode":"ojs"},{"id":784,"value":"meta_data_cols_ini = Object.keys(data[0])\n .filter(x => non_param_cols.includes(x) === false)","pinned":true,"hidden":false,"mode":"ojs"},{"id":786,"value":"gene_names = meta_gene.map(x => x['']).sort()","pinned":true,"hidden":false,"mode":"ojs"},{"id":788,"value":"meta_gene = meta_gene_ini\n .filter(x => x[''].includes('Blank') === false)\n .sort(function(a, b){\n return b['mean'] - a['mean'];\n });","pinned":true,"hidden":false,"mode":"ojs"},{"id":792,"value":"meta_gene_url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/meta_gene.csv'","pinned":true,"hidden":false,"mode":"ojs"},{"id":790,"value":"meta_gene_ini = d3.csv(meta_gene_url)","pinned":true,"hidden":false,"mode":"ojs"},{"id":1048,"value":"meta_gene_ini[0]","pinned":true,"hidden":false,"mode":"ojs"},{"id":812,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":1164,"value":"## Heatmap","pinned":false,"hidden":false,"mode":"md"},{"id":1168,"value":"CGM = require(await FileAttachment(\"clustergrammer-gl@1.0.22.0.packd.js\").url())","pinned":true,"hidden":false,"mode":"ojs"},{"id":1170,"value":"network = FileAttachment(\"leiden_cgm_gene_cats.json\").json()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1182,"value":"heatmap_row","pinned":true,"hidden":false,"mode":"ojs"},{"id":1184,"value":"select_meta ","pinned":true,"hidden":false,"mode":"ojs"},{"id":1172,"value":"$35","pinned":true,"hidden":false,"mode":"ojs"},{"id":1261,"value":"mutable selected_leidens = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":1355,"value":"col_selection = Generators.observe(notify => {\n\n const mousemove = () => {\n \n if (cgm.params.tooltip.tooltip_type === 'col-dendro'){\n mutable select_meta = 'leiden'\n mutable dendro_selected_genes = []\n mutable selected_leidens = cgm.params.dendro.selected_clust_names.map(x => x.replace('Leiden-', ''))\n } \n\n }\n \n viewof cgm.addEventListener(\"click\", mousemove);\n notify(cgm.params.dendro.selected_clust_names.map(x => x.replace('Leiden-', '')));\n\n return () => viewof cgm.removeEventListener(\"mousemove\", mousemove);\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":1359,"value":"mutable dendro_selected_genes = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":1378,"value":"// promised_selected_genes","pinned":true,"hidden":false,"mode":"ojs"},{"id":1367,"value":"promised_selected_genes = Promise.all(dendro_selected_genes.map(gene => { \n\n const url = 'https://raw.githubusercontent.com/cornhundred/testing_something/master/per-gene-counts_slice-1_replicate-2_zip/' + String(gene) + '.csv.zip'\n\n const unzipped_csv = load_zip_csv(url)\n \n return unzipped_csv\n}))","pinned":true,"hidden":false,"mode":"ojs"},{"id":1475,"value":"// cell_data","pinned":true,"hidden":false,"mode":"ojs"},{"id":1193,"value":"row_selection = Generators.observe(notify => {\n\n const mousemove = () => {\n \n // if (cgm.params.tooltip.tooltip_type.includes('dendro')){\n if (cgm.params.tooltip.tooltip_type === 'row-dendro'){\n \n mutable select_meta = 'mean-gene'\n mutable dendro_selected_genes = cgm.params.dendro.selected_clust_names\n } \n \n }\n \n viewof cgm.addEventListener(\"click\", mousemove);\n // notify(cgm.params.dendro.selected_clust_names.map(x => x.replace('Leiden-', '')));\n\n return () => viewof cgm.removeEventListener(\"mousemove\", mousemove);\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":1251,"value":"heatmap_col = Generators.observe(notify => {\n const mouse_click = () => {\n\n // clicking cluster col\n //////////////////////////////\n if (cgm.params.tooltip.tooltip_type === 'col-label'){\n mutable select_meta = 'leiden'\n mutable dendro_selected_genes = []\n mutable selected_leidens = [cgm.params.int.mouseover.col.name.replace('Leiden-', '')] \n }\n \n notify([cgm.params.int.mouseover.col.name])\n }\n \n viewof cgm.addEventListener(\"click\", mouse_click);\n \n notify([cgm.params.int.mouseover.col.name]);\n\n return () => viewof cgm.removeEventListener(\"mousemove\", mouse_click);\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":1176,"value":"heatmap_row = Generators.observe(notify => {\n const mouse_click = () => {\n\n // clicking gene row\n //////////////////////////////\n if (cgm.params.tooltip.tooltip_type === 'row-label'){\n var inst_name = cgm.params.int.mouseover.row.name\n mutable dendro_selected_genes = []\n mutable select_meta = inst_name\n d3.select('#meta_dropdown').select('select').node().value = inst_name \n }\n \n notify(cgm.params.int.mouseover.row.name)\n }\n \n viewof cgm.addEventListener(\"click\", mouse_click);\n \n notify(cgm.params.int.mouseover.row.name);\n\n return () => viewof cgm.removeEventListener(\"mousemove\", mouse_click);\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":1174,"value":"function reactiveValue(container, name, value) {\n return {\n get() {\n return value;\n },\n set(v) {\n value = v;\n container.dispatchEvent(new CustomEvent(\"input\", {detail: {name, value}}));\n return value;\n }\n };\n}","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W36","stdlib":"1","titling":"auto"}