31:T633,// triangle_layer = new deck.PolygonLayer({ // id: 'triangle_layer', // data: deckgl_triangles, // // getFillColor: d => d.color, // getFillColor: d => { // var inst_color // var unselected_opacity_255 = 20 // if (select_cluster === 'none'){ // inst_color = d.color // } else { // inst_color = [d.color[0], d.color[1], d.color[2], unselected_opacity_255] // // check gene name // if (d.name === select_cluster){ // inst_color = d.color // } // } // return inst_color // }, // // getLineWidth: d => poly_line_width, // // lineWidthMinPixels: 2, // getPolygon: d => d.coordinates, // // // modified // stroked: false, // filled: true, // wireframe: true, // pickable: true, // opacity: opacity, // updateTriggers: { // // getFillColor: select_cluster, // getFillColor: selected_leidens, // }, // onClick: (info, event) => { // // onHover: (info, event) => { // // console.log(info.object['name']) // if (select_cluster !== info.object[cat_name]){ // mutable select_cluster = info.object[cat_name] // // mutable select_meta = cat_name // // d3.select('#meta_dropdown').select('select').node().value = cat_name // } else { // mutable select_cluster = 'none' // // mutable select_meta = cat_name // // d3.select('#meta_dropdown').select('select').node().value = cat_name // } // }, // visible: true, // });32:T863,polygon_layer = new deck.PolygonLayer({ id: 'polygon_layer', data: deckgl_polygons, // getFillColor: [250, 0, 0, 255], getFillColor: d => { var color_name = cluster_colors[d.neighborhood] var rgb_array = d3.color(color_name) var rgb = [rgb_array.r, rgb_array.g, rgb_array.b] var inst_color // if (select_cluster === 'none'){ // inst_color = rgb // } else { // inst_color = [rgb[0], rgb[1], rgb[2], unselected_opacity_255] // // check gene name // if (d[cat_name] === select_cluster){ // inst_color = rgb // } // } if (selected_leidens.length === 0){ inst_color = rgb } else { inst_color = [rgb[0], rgb[1], rgb[2], unselected_opacity_255] // check gene name if (selected_leidens.includes(d[cat_name])){ inst_color = rgb } } return inst_color }, // getLineColor: d => { // var color_name = cluster_colors[d.neighborhood] // var rgb_array = d3.color(color_name) // var rgb = [rgb_array.r/2, rgb_array.g/2, rgb_array.b/2] // return rgb // }, getLineWidth: d => poly_line_width, lineWidthMinPixels: 1, getPolygon: d => d.coordinates, updateTriggers: { // getFillColor: select_cluster, getFillColor: selected_leidens, }, stroked: false, filled: true, pickable: true, opacity: neighborhood_opacity, onClick: (info, event) => { // onHover: (info, event) => { // console.log(info.object['name']) if (select_cluster !== info.object[cat_name]){ mutable select_cluster = info.object[cat_name] mutable selected_leidens = [info.object[cat_name]] // mutable select_meta = cat_name // d3.select('#meta_dropdown').select('select').node().value = cat_name } else { mutable select_cluster = 'none' mutable selected_leidens = [] // mutable select_meta = cat_name // d3.select('#meta_dropdown').select('select').node().value = cat_name } } }); 33:T6db,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() }34:T4a0,heatmap_col = Generators.observe(notify => { const mouse_click = () => { // clicking cluster col ////////////////////////////// if (cgm.params.tooltip.tooltip_type === 'col-label'){ mutable select_cluster = 'leiden' mutable dendro_selected_genes = [] // mutable selected_leidens = [cgm.params.int.mouseover.col.name.replace('Leiden-', '')] mutable selected_leidens = [cgm.params.int.mouseover.col.name.split('Leiden-')[1]] // if (mutable selected_leidens[0] !== info.object[cat_name]){ // mutable select_meta = 'leiden' // mutable selected_leidens = [info.object[cat_name]] // d3.select('#meta_dropdown').select('select').node().value = 'none' // } else { // mutable select_meta = 'leiden' // mutable selected_leidens = [] // d3.select('#meta_dropdown').select('select').node().value = 'leiden' // } } notify([cgm.params.int.mouseover.col.name]) } viewof cgm.addEventListener("click", mouse_click); notify([cgm.params.int.mouseover.col.name]); return () => viewof cgm.removeEventListener("mousemove", mouse_click); })35:T73e,make_hull_data = (all_points, cluster_name, cluster_color) => { var rgb_array = d3.color(cluster_color) var rgb = [rgb_array.r, rgb_array.g, rgb_array.b] var cluster_points = all_points.filter(x => x.leiden == String(cluster_name)) var vertices = cluster_points.map(x => [parseFloat(x.x), -parseFloat(x.y)]) var delaunay = Delaunay.from(vertices) // alphashape and alphahull ////////////////////////////////// const filter = alphashapefilter(delaunay, alpha); var alphashape = new Uint8Array(delaunay.triangles.length / 3).map((_, i) => filter(i)); var alphahull = boundary(delaunay, alphashape) // deckgl_points ////////////////////////////////// var deckgl_points = cluster_points.map(x => ({ 'x': -parseFloat(x.x), 'y': -parseFloat(x.y), 'color': rgb })) // deckgl_triangles ////////////////////////////////// var deckgl_triangles = Array.from(alphashape).map((x,i) => { var pos_a = vertices[delaunay.triangles[i * 3 + 0]] var pos_b = vertices[delaunay.triangles[i * 3 + 1]] var pos_c = vertices[delaunay.triangles[i * 3 + 2]] var new_obj = ({ 'coordinates': [pos_a, pos_b, pos_c], 'name': cluster_name, 'id': i, 'color': rgb }) return new_obj }).filter(x => alphashape[x.id] == 1) // deckgl_polygons ////////////////////////////////// var deckgl_polygons = alphahull.map((cluster_points, i) => { var coordinates = cluster_points.map(x => [deckgl_points[x]['x'], deckgl_points[x]['y']] ) var new_obj = ({ 'coordinates': coordinates, 'name': cluster_name, 'color': rgb }) return new_obj }) var hull_data = ({ 'cluster_name': cluster_name, 'deckgl_points': deckgl_points, 'deckgl_triangles': deckgl_triangles, 'deckgl_polygons': deckgl_polygons }) return hull_data }36:T4ce,// based on https://bl.ocks.org/jasondavies/1554783 function boundary(delaunay, members) { const counts = {}, edges = {}, result = []; let r; // Traverse the edges of all member triangles and discard any edges that appear twice. members.forEach((member, d) => { if (!member) return; for (let i = 0; i < 3; i++) { var e = [ delaunay.triangles[3 * d + i], delaunay.triangles[3 * d + ((i + 1) % 3)] ].sort(); (edges[e[0]] = edges[e[0]] || []).push(e[1]); (edges[e[1]] = edges[e[1]] || []).push(e[0]); const k = e.join(":"); if (counts[k]) delete counts[k]; else counts[k] = 1; } }); while (1) { let k = null; // Pick an arbitrary starting point on a boundary. for (k in counts) break; if (k == null) break; result.push((r = k.split(":").map(Number))); delete counts[k]; let q = r[1]; while (q != r[0]) { let p = q, qs = edges[p], n = qs.length; for (let i = 0; i < n; i++) { q = qs[i]; let edge = [p, q].sort().join(":"); if (counts[edge]) { delete counts[edge]; r.push(q); break; } } } } return result; }37:[{"id":"bc0398a8b208d361865edb68905c93b5ccc948ad4fe20e84bd31e9a0c918a5b04978b68fbc6f24b8f041fed820da679ecbfefc047aa026889edd3e03cc3a45dd","href":"https://static.observableusercontent.com/files/bc0398a8b208d361865edb68905c93b5ccc948ad4fe20e84bd31e9a0c918a5b04978b68fbc6f24b8f041fed820da679ecbfefc047aa026889edd3e03cc3a45dd","name":"clustergrammer-gl.0.23.0.packd.js","type":"application/javascript","lastModified":1646863869573.283,"size":1028557}] 2f:{"title":"Neighborhood-Heatmap 0.2.1","cells":[{"id":0,"value":"# Neighborhood-Heatmap 0.2.1\nReferences [Alpha shapes 2](/@fil/alpha-shapes/2) / [Alpha shapes 3](/@fil/alpha-shapes/3)","pinned":false,"hidden":false,"mode":"md"},{"id":70,"value":"\ndashboard = html`\n\n

\n \n

\n\n

\n \n

${container}

\n \n

${viewof cgm}

\n \n

\n\n`\n\n\n\n\n\n// dashboard = html`\n//

\n\n//

\n//

${viewof opacity}

\n//

\n \n//

${container}

\n \n//

\n// ` \n\n\n\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":209,"value":"select_cluster","pinned":true,"hidden":false,"mode":"ojs"},{"id":109,"value":"deckgl_polygons","pinned":true,"hidden":false,"mode":"ojs"},{"id":111,"value":"deckgl_triangles","pinned":true,"hidden":false,"mode":"ojs"},{"id":77,"value":"ini_alpha = 75","pinned":true,"hidden":false,"mode":"ojs"},{"id":66,"value":"viewof alpha = slider({ min: 25, max: 200, value: ini_alpha, step: 5, description: 'alpha parameter'})","pinned":false,"hidden":false,"mode":"ojs"},{"id":64,"value":"viewof opacity = slider({ min: 0.01, max: 1, value: 0.75, step: 0.01, description: 'shape opacity'})","pinned":false,"hidden":false,"mode":"ojs"},{"id":61,"value":"\ncontainer = {\n console.log('--- make container with id the-container\\n---------------------')\n return html `

`\n}\n\n\n// container = html `

`","pinned":true,"hidden":false,"mode":"ojs"},{"id":60,"value":"mutable select_cluster = 'none'","pinned":true,"hidden":false,"mode":"ojs"},{"id":57,"value":"// see https://matplotlib.org/stable/gallery/color/named_colors.html\ncluster_colors = ({ \n '0': 'magenta',\n '1': 'silver',\n '2': 'red',\n '3': 'aqua',\n '4': 'darkblue',\n '6': 'gold',\n '15': 'lime',\n '24': 'blue',\n '17': 'orange',\n '20': 'green',\n '30': 'black', \n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":54,"value":"// working on switch to pre-calc alpha shapes\n/////////////////////////////////////////////////\n// hull_data_array = Object.keys(cluster_colors).map(x => {\n// return make_hull_data(all_points, x, cluster_colors[x])\n// })","pinned":true,"hidden":false,"mode":"ojs"},{"id":49,"value":"deckgl_points = [{\"x\":0,\"y\":0,\"color\":[255,0,255]},{\"x\":-1,\"y\":-0.5,\"color\":[255,0,255]},{\"x\":-2,\"y\":-3,\"color\":[255,0,255]},{\"x\":-4,\"y\":-4,\"color\":[255,0,255]},{\"x\":-10,\"y\":-8,\"color\":[255,0,255]},{\"x\":-20,\"y\":7,\"color\":[255,0,255]},{\"x\":0,\"y\":10,\"color\":[192,192,192]},{\"x\":-1,\"y\":10.5,\"color\":[192,192,192]},{\"x\":-2,\"y\":13,\"color\":[192,192,192]},{\"x\":-4,\"y\":14,\"color\":[192,192,192]},{\"x\":-10,\"y\":18,\"color\":[192,192,192]},{\"x\":-20,\"y\":17,\"color\":[192,192,192]}]\n// deckgl_points = [].concat(... hull_data_array.map(x => x['deckgl_points']))","pinned":true,"hidden":false,"mode":"ojs"},{"id":47,"value":"deckgl_triangles = [] // [].concat(... hull_data_array.map(x => x['deckgl_triangles']))","pinned":true,"hidden":false,"mode":"ojs"},{"id":45,"value":"// deckgl_polygons = [].concat(... hull_data_array.map(x => x['deckgl_polygons']))\ndeckgl_polygons = [{\"coordinates\":[[0,0],[-2,-3],[-10,-8],[-20,7],[0,0]],\"name\":\"0\",\"color\":[255,0,255]},{\"coordinates\":[[-10,18],[-20,17],[0,10],[-2,13],[-10,18]],\"name\":\"1\",\"color\":[192,192,192]}]","pinned":true,"hidden":false,"mode":"ojs"},{"id":96,"value":"check_deckgl_polygons = deckgl_polygons","pinned":true,"hidden":false,"mode":"ojs"},{"id":113,"value":"check_deckgl_triangles = deckgl_triangles.length","pinned":true,"hidden":false,"mode":"ojs"},{"id":43,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":253,"value":"neighborhood_opacity = 0.75","pinned":true,"hidden":false,"mode":"ojs"},{"id":265,"value":"unselected_opacity_255 = 5","pinned":true,"hidden":false,"mode":"ojs"},{"id":80,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":206,"value":"deckgl_polygons[0]","pinned":true,"hidden":false,"mode":"ojs"},{"id":242,"value":"// selected_deckgl_points = deckgl_points.filter(x => x.leiden == select_cluster)\nselected_deckgl_points = deckgl_points.filter(x => selected_leidens.includes(x.leiden))\n\n\n// if (selected_leidens.length === 0){\n// inst_color = rgb\n// } else {\n// inst_color = [rgb[0], rgb[1], rgb[2], unselected_opacity_255]\n// // check gene name\n// if (selected_leidens.includes(d[cat_name])){\n// inst_color = rgb\n// }\n// } ","pinned":true,"hidden":false,"mode":"ojs"},{"id":248,"value":"transcript_radius = 1","pinned":true,"hidden":false,"mode":"ojs"},{"id":151,"value":"radius_min_pixels = 1","pinned":true,"hidden":false,"mode":"ojs"},{"id":259,"value":"transcript_opacity = 0.75","pinned":true,"hidden":false,"mode":"ojs"},{"id":262,"value":"darken_transcripts_factor = 1","pinned":true,"hidden":false,"mode":"ojs"},{"id":83,"value":"scatter_layer = new deck.ScatterplotLayer({\n id: 'scatter_layer',\n // data: scatter_data,\n data: selected_deckgl_points,\n getPosition: d => {\n return [d.x, d.y]\n },\n getFillColor: d => {\n // points are labeled by leiden cluster\n var color_name = cluster_colors[d.leiden]\n var rgb_array = d3.color(color_name)\n var rgb = [rgb_array.r/darken_transcripts_factor, \n rgb_array.g/darken_transcripts_factor, \n rgb_array.b/darken_transcripts_factor]\n return rgb\n },\n getRadius: transcript_radius, \n pickable: true,\n // autoHighlight: true,\n highlightColor: d => [50, 50, 50], \n radiusMinPixels: radius_min_pixels,\n updateTriggers: {\n getFillColor: select_cluster,\n // getPosition: map_type\n }, \n opacity: transcript_opacity,\n // set to toggle based on clicking neighborhood \n visible: true\n })","pinned":true,"hidden":false,"mode":"ojs"},{"id":221,"value":"deckgl_points[0]","pinned":true,"hidden":false,"mode":"ojs"},{"id":42,"value":"cat_name = 'neighborhood'","pinned":true,"hidden":false,"mode":"ojs"},{"id":40,"value":"// deckgl.setProps({layers: [triangle_layer, polygon_layer, scatter_layer]});\ndeckgl.setProps({layers: [scatter_layer, polygon_layer]});","pinned":true,"hidden":false,"mode":"ojs"},{"id":38,"value":"poly_line_width = 1","pinned":true,"hidden":false,"mode":"ojs"},{"id":35,"value":"height = 850","pinned":true,"hidden":false,"mode":"ojs"},{"id":33,"value":"center_x = d3.mean(deckgl_points.map(x => x['x']))","pinned":true,"hidden":false,"mode":"ojs"},{"id":32,"value":"center_y = d3.mean(deckgl_points.map(x => x['y']))","pinned":true,"hidden":false,"mode":"ojs"},{"id":30,"value":"// zoom = -2.75\nzoom = 3","pinned":true,"hidden":false,"mode":"ojs"},{"id":27,"value":"min_zoom = -6","pinned":true,"hidden":false,"mode":"ojs"},{"id":25,"value":"INITIAL_VIEW_STATE_2D = ({\n target: [center_x, center_y, 0],\n zoom: zoom,\n minZoom:min_zoom, \n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":24,"value":"deckgl = {\n \n container.innerHTML = '';\n \n var view = new deck.OrthographicView({id: 'ortho'}) \n var INITIAL_VIEW_STATE = INITIAL_VIEW_STATE_2D \n\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 && ` ${object.name}\n `}, \n \n });\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":19,"value":"deck = require.alias({\n // optional dependencies\n h3: {},\n s2Geometry: {}\n})('deck.gl@8.3.7/dist.min.js')","pinned":true,"hidden":false,"mode":"ojs"},{"id":13,"value":"import {slider} from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":11,"value":"Delaunay = (await require(\"d3-delaunay\")).Delaunay","pinned":true,"hidden":false,"mode":"ojs"},{"id":75,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":276,"value":"# Clustergrammer-GL","pinned":false,"hidden":false,"mode":"md"},{"id":302,"value":"network = ({'row_nodes': [{'name': 'gene-1',\n 'ini': 2,\n 'clust': 0,\n 'rank': 0,\n 'rankvar': 0},\n {'name': 'gene-2', 'ini': 1, 'clust': 1, 'rank': 1, 'rankvar': 1}],\n 'col_nodes': [{'name': 'one',\n 'ini': 2,\n 'clust': 0,\n 'rank': 0,\n 'rankvar': 0,\n 'cat-0': 'leiden: dog',\n 'cat_0_index': 0},\n {'name': 'two',\n 'ini': 1,\n 'clust': 1,\n 'rank': 1,\n 'rankvar': 1,\n 'cat-0': 'leiden: elephant',\n 'cat_0_index': 1}],\n 'links': [],\n 'mat': [[1, 0], [0, 1]],\n 'cat_colors': {'row': {},\n 'col': {'cat-0': {'leiden: dog': '#393b79', 'leiden: elephant': '#ff7f0e'}}},\n 'global_cat_colors': {'dog': '#393b79', 'elephant': '#ff7f0e'},\n 'matrix_colors': {'pos': 'red', 'neg': 'blue'},\n 'linkage': {'row': [[0.0, 1.0, 1.0, 2.0]], 'col': [[0.0, 1.0, 1.0, 2.0]]},\n 'views': []})","pinned":true,"hidden":false,"mode":"ojs"},{"id":300,"value":"mutable selected_leidens = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":280,"value":"$33","pinned":true,"hidden":false,"mode":"ojs"},{"id":282,"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_cluster = 'mean-gene'\n mutable dendro_selected_genes = cgm.params.dendro.selected_clust_names\n // mutable selected_leidens = cgm.params.dendro.selected_clust_names.map(x => x.replace('Leiden-', ''))\n mutable selected_leidens = cgm.params.dendro.selected_clust_names.map(x => x.split('Leiden-')[1])\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":284,"value":"col_selection = Generators.observe(notify => {\n\n const mousemove = () => {\n \n if (cgm.params.tooltip.tooltip_type === 'col-dendro'){\n mutable select_cluster = 'leiden'\n mutable dendro_selected_genes = []\n // mutable selected_leidens = cgm.params.dendro.selected_clust_names.map(x => x.replace('Leiden-', ''))\n mutable selected_leidens = cgm.params.dendro.selected_clust_names.map(x => x.split('Leiden-')[1])\n } \n\n }\n \n viewof cgm.addEventListener(\"click\", mousemove);\n // notify(cgm.params.dendro.selected_clust_names.map(x => x.replace('Leiden-', '')));\n notify(cgm.params.dendro.selected_clust_names.map(x => x.split('Leiden-')[1]));\n\n return () => viewof cgm.removeEventListener(\"mousemove\", mousemove);\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":286,"value":"mutable dendro_selected_genes = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":331,"value":"heatmap_cell = Generators.observe(notify => {\n const mouse_click = () => {\n\n // clicking gene row\n //////////////////////////////\n if (cgm.params.tooltip.tooltip_type === 'matrix-cell'){\n // var inst_name = cgm.params.int.mouseover.row.name.replace('Leiden-', '')\n mutable dendro_selected_genes = []\n // mutable select_cluster = inst_name\n mutable selected_leidens = [\n // cgm.params.int.mouseover.row.name.replace('Leiden-', ''),\n cgm.params.int.mouseover.row.name.split('Leiden-')[1],\n \n // cgm.params.int.mouseover.col.name.replace('Leiden-', '')\n cgm.params.int.mouseover.col.name.split('Leiden-')[1]\n ] \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":288,"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.replace('Leiden-', '')\n var inst_name = cgm.params.int.mouseover.row.name.split('Leiden-')[1]\n \n mutable dendro_selected_genes = []\n // mutable select_cluster = inst_name\n // mutable selected_leidens = [cgm.params.int.mouseover.row.name.replace('Leiden-', '')] \n mutable selected_leidens = [cgm.params.int.mouseover.row.name.split('Leiden-')[1]] \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":290,"value":"$34","pinned":true,"hidden":false,"mode":"ojs"},{"id":292,"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"},{"id":298,"value":"CGM = require(await FileAttachment(\"clustergrammer-gl.0.23.0.packd.js\").url())","pinned":true,"hidden":false,"mode":"ojs"},{"id":146,"value":"### Functions","pinned":false,"hidden":false,"mode":"md"},{"id":51,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"// based on https://bl.ocks.org/gka/1552725 \nfunction alphashapefilter(delaunay, alpha) {\n const asq = alpha ** 2;\n function dist2(p, q) {\n return (\n (delaunay.points[2 * p] - delaunay.points[2 * q]) ** 2 +\n (delaunay.points[2 * p + 1] - delaunay.points[2 * q + 1]) ** 2\n );\n }\n return function(i) {\n let t0 = delaunay.triangles[i * 3 + 0],\n t1 = delaunay.triangles[i * 3 + 1],\n t2 = delaunay.triangles[i * 3 + 2];\n return dist2(t0, t1) < asq && dist2(t1, t2) < asq && dist2(t2, t0) < asq;\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":17,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W37","stdlib":"1","titling":"auto"}