29:null 2a:["$","title",null,{"children":"Visualizing the loss of rod and cone photoreceptor cells | S. Scott Whitmore | Observable"}] 2f:Td45,// bscan_canvas_segmentation = function(image_data, thickness_data, show_bscan, is_simulated){ bscan_canvas_segmentation = { // Modifying Mike Bostock's example: https://observablehq.com/@d3/canvas-horizon-chart const div = html`

`; let bscan = image_data.filter(d => d.laterality == which_eye ) let width = 768 let height = 496 // image_data.filter(d => d.laterality == which_eye )[0].image const canvas = d3.select(div) .selectAll("canvas") .data(bscan) .enter().append(() => DOM.context2d(width, height).canvas) .style("position", "absolute") .style("width", `${width}px`) .style("height", `${height}px`) .each(draw_bscan) const svg = d3.select(div.appendChild(DOM.svg(768, 496))) .style("position", "relative") // TASK: Add line data here... // svg.append("g") // .call(xAxis); let data_no_vitreous = thickness_modified_eye .filter(d => d["surface_id"] > 1) .orderby("surface_id") let data = Array.from(d3.group(data_no_vitreous, d => d.surface_id), ([key, value]) => ({key, value})) let x = d3.scaleLinear() .range([0, width]) .domain([1,768]) let y = d3.scaleLinear() .range([height, 0]) .domain(y_domain) let line = d3.line() .x(d => x(d.ascan_id)) .y(d => y(d.z_um)) let area = d3.area() .x(d => x(d.ascan_id)) .y0(496) .y1(d => y(d.z_um)) let color = d3.scaleOrdinal() .domain(d3.range(2, 12)) .range(d3.schemePaired) let layers = svg.append("g") .selectAll(".layers") .data(data) .enter().append("path") .attr("id", d => +d.key) .attr("stroke", d => color(+d.key)) // .attr("stroke", d => color(+d.key)) .attr("fill", d => color(+d.key)) // .attr("fill", d => color(+d.key)) .attr("opacity", +(show_layers == "Layers")) .attr("d", d=> area(d.value)) let lines = svg.append("g") .selectAll(".surfaces") .data(data) .enter().append("path") .attr("id", d => +d.key) .attr("stroke", d => color(+d.key)) .attr("fill", "none") .attr("opacity", +(show_layers == "Surfaces")) .attr("stroke-width", 2) .attr("d", d=> line(d.value)) function draw_bscan (d) { const context = this.getContext("2d"); // canvas.style = "width: 60%"; this.width = width this.height = height console.log("this:", this.width, this.height) context.drawImage(d.image, 0, 0, width, height); if(show_bscan) { const bscanData = context.getImageData( 0, 0, width, height ); console.log("bscanData: width = ", bscanData.width, ", height = ", bscanData.height) // modify_segmentation(bscanData.data, thickness_modified_eye.orderby("surface_id").objects()) modify_working(bscanData.data, thickness_modified_eye.orderby("surface_id").objects()) console.log("bscanData: width = ", bscanData.width, ", height = ", bscanData.height) context.putImageData(bscanData, 0, 0); } // Change the title if photoreceptor survival drops below 100% let title = "Original" if(is_simulated & show_bscan) { title = "Simulation" } context.fillStyle = "#B88A00"; context.font = "30px Helvetica"; context.fillText(title, 10, 40); // return canvas; } return div }30:T63e,// To use copied code replace "data" with your own variable modify_thickness = function(data, rods_surviving, cones_surviving) { let thickness_modified = aq.from(data) .derive( { thickness_modified: aq.escape(d => d.is_outerretina * d.thickness * (d.proportion_rods * rods_surviving + (1 - d.proportion_rods) * cones_surviving) + (1 - d.is_outerretina) * d.thickness) } ) .derive({laterality_ascan_group: d => d.laterality + "_" + d.ascan_id}) .groupby('laterality_ascan_group') .orderby("ascan_id") .orderby(aq.desc("surface_id")) .derive({ z_original: aq.rolling(d => op.sum(d.thickness)) }) .derive({ thickness_residual: d => op.sum(d.thickness) - op.sum(d.thickness_modified)}) .derive({ thickness_modified_adjusted: d => (d.surface_id == 1) ? d.thickness_modified + d.thickness_residual : d.thickness_modified }) // For dealing with voxel data: .derive({ thickness_mod_rounded: d => Math.round(d.thickness_modified_adjusted)}) .derive({ thickness_mod_rounded_residual: d => op.sum(d.thickness) - op.sum(d.thickness_mod_rounded) }) .derive({ thickness_mod_rounded_adjusted: d => (d.surface_id == 1) ? d.thickness_mod_rounded + d.thickness_mod_rounded_residual : d.thickness_mod_rounded }) .derive({ z: aq.rolling(d => op.sum(d.thickness_modified_adjusted)) }) .derive({ z_um: d => (496 - d.z) * d.z_units * 1000}) .ungroup() // .objects() // Uncomment to return an array of objects return thickness_modified } 31:T5eb,modify_working = function(data, thickness_data) { for(let ascan_id = 0; ascan_id < 768; ascan_id++) { // The A-scans begin at 1 not 0 let surface_positions = thickness_data.filter(d => d.ascan_id == ascan_id+1).map(d => d.z_original) .sort() // Add the position of the vitreous surface_positions.unshift(0) surface_positions.pop() let modified_thicknesses = thickness_data.filter(d => d.ascan_id == ascan_id+1) .sort((a, b) => (a.surface_id > b.surface_id) ? 1 : -1) .map(d => d.thickness_mod_rounded_adjusted) let ascan_original = new Array(496) // Copy the original data for(let row_index = 0; row_index < 496; row_index++) { let array_index = 768*4*row_index + ascan_id*4 ascan_original[row_index] = data[array_index] } // Modify the copied data // Confession: I'm not sure why I needed to reverse the vectors where I did--but it works. // If someone wants to suggest how to make this simpler, please do! let ascan_modified = modify_vector(ascan_original.reverse(), surface_positions, modified_thicknesses.reverse()).reverse() // Copy the modified data back into the data object for(let row_index = 0; row_index < 496; row_index++) { let array_index = 768*4*row_index + ascan_id*4 data[array_index + 0] = ascan_modified[row_index] data[array_index + 1] = ascan_modified[row_index] data[array_index + 2] = ascan_modified[row_index] } } }32:[{"id":"aa6a276a6ba08c2f167db1b4004ef90d2a8f6184c494562305086f7bcbeead92b37101fe9e11964354291874938ea0fb7b0de1012d0a657b6d09c0102438ff41","href":"https://static.observableusercontent.com/files/aa6a276a6ba08c2f167db1b4004ef90d2a8f6184c494562305086f7bcbeead92b37101fe9e11964354291874938ea0fb7b0de1012d0a657b6d09c0102438ff41","name":"central_bscan_data@2.tsv","type":"text/tab-separated-values","lastModified":1633460949176.074,"size":1030413},{"id":"42363388cf383f7a214f64391f02a2ff014c8d1c10758609966b2bfebd2323ac985f2ac4886359f9dda6810ad207a57232318c8f8d96c0d93843e594eaebaf1b","href":"https://static.observableusercontent.com/files/42363388cf383f7a214f64391f02a2ff014c8d1c10758609966b2bfebd2323ac985f2ac4886359f9dda6810ad207a57232318c8f8d96c0d93843e594eaebaf1b","name":"central_bscan_od@2.png","type":"image/png","lastModified":1633729785707.402,"size":250429},{"id":"04448afec60224c9eb6531089b4fc4c208d2967d3f878b5e9fef52fa92b147764a029185c1da4bf7b6d8b27e6ef21a2c9cdfb3d60e249e7283a5953ce75b24dc","href":"https://static.observableusercontent.com/files/04448afec60224c9eb6531089b4fc4c208d2967d3f878b5e9fef52fa92b147764a029185c1da4bf7b6d8b27e6ef21a2c9cdfb3d60e249e7283a5953ce75b24dc","name":"central_bscan_os@1.png","type":"image/png","lastModified":1633729785734.716,"size":213570}] 2d:{"id":"833c31731ec28006","slug":"simulating-rod-and-cone-loss","title":"Visualizing the loss of rod and cone photoreceptor cells","thumbnail":"f7a567521d7a082d0a62e64b01774ef103d46df47694ea5644dfd5db206a0b86","access_level":"public","create_time":"$D2021-10-02T01:13:19.732Z","update_time":"$D2023-05-12T13:22:53.666Z","view_time":null,"first_public_time":"$D2022-01-02T04:37:29.483Z","has_unpublished_edits":null,"fork":{"id":"bd116742b1f91cf4","slug":"simple-d3","title":"Simple D3","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"stars":6,"starred":false,"owner":{"type":"team","id":"9f9ba4a25d6eb4e6","login":"barefootbiology","name":"S. Scott Whitmore","avatar_url":"https://avatars-next.observableusercontent.com/d6de548b1e86c3eebe1ecbd5fe21dedd4bc39e7a2fdfa579b00cd99d549f6e0a","tier":"starter_2024"},"version":2117,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"dd2940d75505b352","login":"barefootbiology","name":"S. Scott Whitmore","avatar_url":"https://avatars-next.observableusercontent.com/d6de548b1e86c3eebe1ecbd5fe21dedd4bc39e7a2fdfa579b00cd99d549f6e0a","tier":null}],"members":[{"type":"individual","id":"dd2940d75505b352","login":"barefootbiology","name":"S. Scott Whitmore","avatar_url":"https://avatars-next.observableusercontent.com/d6de548b1e86c3eebe1ecbd5fe21dedd4bc39e7a2fdfa579b00cd99d549f6e0a","tier":null,"role":"editor"},{"type":"individual","id":"3e1bcea33fa0210a","login":"drewvoigt10","name":"","avatar_url":"https://avatars-next.observableusercontent.com/7365a3a68a514dadeb39a264512a67a3de556944a62cfefd2e6d222150ffd882","tier":null,"role":"viewer"}],"comments":[{"id":"ad52a8177f5172eb","reply_to_id":null,"content":"Me and my failure at reading comprehension: \"wait, OCTs can cause a loss of photoreceptor cells?! 😱\"","create_time":"$D2022-01-02T12:55:58.455Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"d36034ddfb454bdd","login":"jobleonard","name":"Job van der Zwan","avatar_url":"https://avatars-next.observableusercontent.com/808373580aa09723ceabb9cb31d01ea6db287280b59eaa63618e259f5d28dd71","tier":null}},{"id":"07c939469116397e","reply_to_id":"ad52a8177f5172eb","content":"Typo: \"rods in subtle\"","create_time":"$D2022-01-02T14:23:36.641Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"07362516b5994994","login":"mootari","name":"Fabian Iwand","avatar_url":"https://avatars-next.observableusercontent.com/0d7defa821f38094c03bad23b9b360a5364e6e97e21fc238c39ddc48db7994ad","tier":null}},{"id":"24eb2553b9c36122","reply_to_id":"ad52a8177f5172eb","content":"Thanks to you both!","create_time":"$D2022-01-02T23:27:04.950Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"dd2940d75505b352","login":"barefootbiology","name":"S. Scott Whitmore","avatar_url":"https://avatars-next.observableusercontent.com/d6de548b1e86c3eebe1ecbd5fe21dedd4bc39e7a2fdfa579b00cd99d549f6e0a","tier":null}}],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":null,"type":"notebook","body":{"title":"Visualizing the loss of rod and cone photoreceptor cells","cells":[{"id":0,"value":"# Visualizing the loss of rod and cone photoreceptor cells\n\n>

**Related research article:** Whitmore, S.S., et al. Modeling rod and cone photoreceptor cell survival in vivo using optical coherence tomography. *Scientific Reports* **13**, 6896 (2023).\n10.1038/s41598-023-33694-y

\n\nCould you guess what percentage of photoreceptor cells were lost? The difference between 100% surviving rods and 50% surviving rods is subtle. To see just how subtle cell loss can be, try changing the percentages of rods and cones below:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1959,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":906,"value":"legend = Swatches(d3.scaleOrdinal(plot_fill.domain.map(d => layer_scale(d - 1)), plot_fill.range), {title: \"Retinal layers\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":589,"value":"html`Figure 1: ${(rods_surviving * 100).toFixed(0)}% rods surviving and ${(cones_surviving * 100).toFixed(0)}% cones. Adjust the controls below.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1957,"value":"viewof show_layers = Inputs.radio([\"None\", \"Surfaces\", \"Layers\"], {value: \"None\", label: \"Display retinal layer segmentation?\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"viewof rods_surviving_percentage = Inputs.range([0, 100], {step: 1, label: \"Percentage of rods surviving\", value: 100})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"viewof cones_surviving_percentage = Inputs.range([0, 100], {step: 1, label: \"Percentage of cones surviving\", value: 100})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":470,"value":"viewof which_eye_select = Inputs.radio([\"Right\", \"Left\"], {label: \"Select eye\", value: \"Right\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1758,"value":"viewof show_bscan = Inputs.toggle({label: \"Simulated B-scan: Show / Hide\", value: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":601,"value":"## Quiz\nTry guessing what percentage of rod and cone photoreceptor cells survive in the following patient:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1837,"value":"bscan_canvas(bscan_random, thickness_modified_eye_random.orderby(\"surface_id\").objects(), true, true)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":846,"value":"viewof new_quiz = Inputs.button(\"New quiz\", {reduce: () => set(viewof submit_guess, 0)} )","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1863,"value":"Your guesses:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":632,"value":"viewof rods_surviving_guess_percentage = Inputs.range([0, 100], {step: 1, label: \"Percentage of rods surviving\", value: 100})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":638,"value":"viewof cones_surviving_guess_percentage = Inputs.range([0, 100], {step: 1, label: \"Percentage of cones surviving\", value: 100})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":844,"value":"viewof submit_guess = Inputs.button(\"Submit guess\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":668,"value":"submit_guess ? md`Actual surviving rods: ${Math.round(rods_surviving_random * 100)}%. Your answer was off by ${Math.round(rods_surviving_difference)}%
Actual surviving cones: ${Math.round(cones_surviving_random * 100)}%. Your answer was off by ${Math.round(cones_surviving_difference)}%` : md`Awaiting your guess.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1984,"value":"## How it works\n\nTo build the model, we used rod and cone density data originally published in (Curcio, C. A., Sloan, K. R., Kalina, R. E., Hendrickson, A. E., 1990. [Human photoreceptor topography](https://doi.org/10.1002/cne.902920402). J Comp Neurol 292, 497-523. PMID 2324310). Dr. Curcio has made the data available for download from her [research website](https://christineacurcio.com/PRtopo/). Using custom software, we registered the cell density data to an OCT volume in R, interpolated cell densities for every A-scan in the volume, and computed the expected proportion of rods and cones at each position. The model implemented here assumes that thickness of the outer retina is proportional to the surviving proportion of rods and cones. Details are available in [our published paper](https://doi.org:10.1038/s41598-023-33694-y).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":192,"value":"## Appendix A: Math","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":167,"value":"We modify the thickness data based on the number of surviving rods and cones:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":976,"value":"thickness_{new}= thickness_{original} \\times ((proportion_{rods}\\times surviving_{rods}) + (1 - proportion_{rods})\\times surviving_{cones} )","pinned":false,"hidden":false,"mode":"tex","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":883,"value":"## Appendix B: Code","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2111,"value":"which_eye = {\n if(which_eye_select == \"Right\") { return \"OD\"} else { return \"OS\"}\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2039,"value":"rods_surviving = rods_surviving_percentage / 100","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2049,"value":"cones_surviving = cones_surviving_percentage / 100","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2062,"value":"rods_surviving_guess = rods_surviving_guess_percentage / 100","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2065,"value":"cones_surviving_guess = cones_surviving_guess_percentage / 100","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":226,"value":"import { aq } from '@uwdata/arquero'","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1026,"value":"import {vl} from '@vega/vega-lite-api-v5'","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":933,"value":"### Data import","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1002,"value":"Import central B-scan image:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1117,"value":"FileAttachment(\"central_bscan_od@2.png\").url()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1950,"value":"FileAttachment(\"central_bscan_od@2.png\").url()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1013,"value":"bscan_os_image = FileAttachment(\"central_bscan_os@1.png\").image()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1010,"value":"bscan_od_image = FileAttachment(\"central_bscan_od@2.png\").image()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1095,"value":"image_data = [\n {laterality: \"OD\", image: bscan_od_image, url: \"https://raw.githubusercontent.com/barefootbiology/examplebscans/main/data/central_bscan_od.png\", url2: await FileAttachment(\"central_bscan_od@2.png\").url(), x: 0, y: 0}, \n {laterality: \"OS\", image: bscan_os_image, url: \"https://raw.githubusercontent.com/barefootbiology/examplebscans/main/data/central_bscan_os.png\", url2: await FileAttachment(\"central_bscan_os@1.png\").url(), x: 0, y: 0}\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1176,"value":"image_data_eye = aq.from(image_data)\n .filter(aq.escape(d => d[\"laterality\"] == which_eye))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1809,"value":"simulated_bscan = bscan_canvas(bscan, thickness_modified_eye.orderby(\"surface_id\").objects(), show_bscan, is_simulated)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1953,"value":"current_bscan_data = {\n return { \"url\": simulated_bscan.toDataURL(), \"x\": 0, \"y\": 0 }\n }","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"data_file = FileAttachment(\"central_bscan_data@2.tsv\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1433,"value":"bscan_canvas = function(bscan, thickness_data, show_bscan, is_simulated){\n \n const canvas = DOM.canvas(bscan.naturalWidth, bscan.naturalHeight);\n const context = canvas.getContext(\"2d\");\n canvas.style = \"width: 60%\";\n \n context.drawImage(bscan, 0, 0, bscan.naturalWidth, bscan.naturalHeight);\n\n \n if(show_bscan) {\n \n const bscanData = context.getImageData(\n 0,\n 0,\n bscan.naturalWidth,\n bscan.naturalHeight\n );\n \n // modify_segmentation(bscanData.data, thickness_modified_eye.orderby(\"surface_id\").objects())\n modify_working(bscanData.data, thickness_data)\n \n context.putImageData(bscanData, 0, 0);\n }\n\n // Change the title if photoreceptor survival drops below 100%\n let title = \"Original\"\n if(is_simulated & show_bscan) {\n title = \"Simulation\"\n } \n \n context.fillStyle = \"#B88A00\";\n context.font = \"30px Helvetica\";\n context.fillText(title, 10, 40);\n\n return canvas;\n \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"thickness_data = d3.tsvParse(await data_file.text(data_file), d3.autoType)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":229,"value":"$30","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1342,"value":"thickness_modified = modify_thickness(thickness_data, rods_surviving, cones_surviving)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":475,"value":"thickness_modified_eye = thickness_modified\n .filter(aq.escape(d => d[\"laterality\"] == which_eye))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":941,"value":"### Basic plotting parameters","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":201,"value":"Scales for plotting the original thickness data:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":159,"value":"x = d3.scaleLinear()\n .domain([1, d3.max(thickness_data, d => d.ascan_id)])\n .range([margin.left, width - margin.right])\n .interpolate(d3.interpolateRound)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":513,"value":"x_mm = d3.scaleLinear()\n .domain([d3.min(thickness_data, d => d.x_mm), d3.max(thickness_data, d => d.x_mm)])\n .range([margin.left, width - margin.right])\n .interpolate(d3.interpolateRound)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":165,"value":"y = d3.scaleLinear()\n .domain([1, 496])\n .range([height - margin.top, margin.bottom])\n .interpolate(d3.interpolateRound)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":304,"value":"color_surface = d3.scaleOrdinal()\n .range(d3.schemePaired)\n .domain([2,3,4,5,6,7,8,9,10])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":205,"value":"Note that the y scale needs to flip the axis:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":271,"value":"Scales for the surface segmentation plots:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"height = 400","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":161,"value":"margin = ({top: 20, right: 0, bottom: 0, left: 30})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":375,"value":"surface_ids = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":954,"value":"These plotting functions are works in progress. I want to add a legend for the retinal layers, but haven't got it working yet.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":891,"value":"layer_scale = d3.scaleOrdinal()\n .domain([0,1,2,3,4,5,6,7,8,9,10,11])\n .range([\"vitreous\", \"nerve fiber layer\", \"ganglion cell layer\", \"inner plexiform layer\", \"inner nuclear layer\", \"outer plexiform layer\", \"outer nuclear layer\", \"ellipsoid zone\", \"outer segments\", \"interdigitation zone\", \"RPE/Bruch's membrane complex\", \"choroid and sclera\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":907,"value":"plot_fill = rodconeloss.scale(\"color\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":915,"value":"import {Legend, Swatches} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":920,"value":"plot_fill.domain.map(d => layer_scale(d - 1))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":937,"value":"### Experimental data wrangling","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":962,"value":"I used these functions to experiment with data wrangling. See Mike Freeman's [\"Data Wrangler\"](https://observablehq.com/@observablehq/data-wrangler) notebook for details.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":238,"value":"import {Copier} from \"@mbostock/copier\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":236,"value":"import {Wrangler, op} from \"@observablehq/data-wrangler\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":945,"value":"### Values for the quiz","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":689,"value":"laterality_random = {\n new_quiz;\n yield [\"OD\", \"OS\"][d3.randomInt(0, 2)(1)]\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":605,"value":"rods_surviving_random = {\n new_quiz;\n yield Math.round((d3.randomUniform(0, 1)(1) * 100)) / 100;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":607,"value":"cones_surviving_random = {\n new_quiz;\n yield Math.round(d3.randomUniform(0, 1)(1) * 100) / 100;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":677,"value":"cones_surviving_difference = (cones_surviving_random - cones_surviving_guess) * 100","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":739,"value":"rods_surviving_difference = (rods_surviving_random - rods_surviving_guess) * 100","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":609,"value":"thickness_modified_random = modify_thickness(thickness_data, rods_surviving_random, cones_surviving_random)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":624,"value":"thickness_modified_eye_random = thickness_modified_random\n .filter(aq.escape(d => d[\"laterality\"] == laterality_random))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":969,"value":"The `set` function let's one input change the value of another input. I'm using it for the \"Submit guess\" and \"New quiz\" buttons.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":868,"value":"import {set} from '@observablehq/synchronized-inputs'","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1194,"value":"### Simulating a B-scan","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1196,"value":"1. Get a single A-scan.\n2. Get the unmodified segmentation at this position.\n3. Get the modified segmentation at this position.\n4. Draw a three column picture showing the mapping from A-scan voxel intensities, unmodified segmentation, and modified segmentation.\n5. Work out the function to use these three sources as input data.\n6. Plot the modified intensity data as a fourth column.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1229,"value":"viewof which_ascan = Inputs.range([1, 768], {step: 1, label: \"Amount\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1204,"value":"thickness_modified_eye_ascan = thickness_modified_eye.filter(aq.escape(d => d[\"ascan_id\"] == which_ascan))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1268,"value":"ascan_domain = [1, 496]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1277,"value":"image_data.filter(d => d.laterality == which_eye)[0][\"image\"]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1288,"value":"bscan_od_image","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":535,"value":"plot_rodconeloss = function(data, layers) {\n let data_no_vitreous = data\n .filter(d => d[\"surface_id\"] > 1)\n .orderby(\"surface_id\")\n\n return Plot.plot({\n x: {domain: x_domain },\n y: {domain: y_domain}, \n color: {\n type: \"ordinal\",\n scheme: \"paired\"\n },\n marks: [\n Plot.areaY(data_no_vitreous, {x: \"x_mm\", y1: y_domain[0], y2: \"z_um\", fill: \"surface_id\", fillOpacity: +layers}),\n Plot.line(data_no_vitreous, {x: \"x_mm\", y: \"z_um\", stroke: \"surface_id\"})\n ]\n })\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1391,"value":"x_domain = [d3.min(thickness_modified, d => d.x_mm), d3.max(thickness_modified, d => d.x_mm)]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1401,"value":"y_domain = [496 * 0.003872 * 1000, 0]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1294,"value":"## Generating a modified B-scan","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1300,"value":"import {modify_vector, inverse_rle, compute_thickness} from '@barefootbiology/resizing-segmented-vectors'","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1321,"value":"### Working with the B-scan image data\n\nHere's what we need:\n\n1. The B-scan image as a 2D array.\n2. The original surface positions as a 2D array. (Alternatively, we could use the original layer thicknesses.)\n3. The modified layer thicknesses as a 2D array.\n\nAlternatively, you could treat all the data as a giant 1D vector.\n\nA column in the B-scan images is called an A-scan.\n\nHere's what we'll do:\n\n1. Create a new container to hold the result.\n2. For each A-scan, run `modify_vector(bscan[i,], segmentation[i, ], modified_thickness[i, ])`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1419,"value":"// Get the current B-scan image\nbscan = image_data.filter(d => d.laterality == which_eye )[0].image","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1855,"value":"bscan_random = image_data.filter(d => d.laterality == laterality_random )[0].image","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1755,"value":"$31","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1820,"value":"is_simulated = (rods_surviving < 1) | (cones_surviving < 1)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":655,"value":"viewof layers = Inputs.toggle({label: \"Layers: On / Off\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1379,"value":"rodconeloss = plot_rodconeloss(thickness_modified_eye, layers)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 2e:"$2d:body"