40:null 41:["$","title",null,{"children":"Grouped Waffle Chart - single shape per category | Jasper Croome | Observable"}] 47:T4d5,// example dataset data = Object({ Energy: { Total: 732, "Energy Use in Industry": { Total: 242, "Iron and Steel": 72, "Non-Ferrous Metals": 7, "Chemical & Petrochemical": 36, "Food & Tobacco": 1, "Paper & Pulp": 6, Machinery: 5, "Other Industry": 106 }, Transport: { Total: 162, "Road Transport": 119, Aviation: 19, Shipping: 17, Rail: 4, Pipeline: 2 }, "Energy Use in buildings": { Total: 175, "Residential Buildings": 109, Commercial: 66 }, "Unallocated fuel combustion": { Total: 78 }, "Fugitive emissions from energy production": { Total: 58 }, "Energy in Agriculture & Fishing": { Total: 17 } }, Industry: { Total: 25, Chemicals: { Total: 22 }, Cement: { Total: 3 } }, Waste: { Total: 32, Wastewater: { Total: 13 }, Landfills: { Total: 19 } }, "Agriculture, Forestry & Land Use": { Total: 184, "Livestock & Manure": { Total: 58 }, "Agricultural soils": { Total: 41 }, "Rice Cultivation": { Total: 13 }, "Crop burning": { Total: 35 }, Deforestation: { Total: 22 }, Cropland: { Total: 14 }, Grassland: { Total: 1 } } })48:T329c,{ const dataEntries = Object.entries(data); let firstTier = {}; let secondTier = {}; let thirdTier = {}; dataEntries.map((d) => { firstTier[d[0]] = { value: d[1]["Total"] }; Object.entries(d[1]) .filter((d) => d[0] !== "Total") .sort((a, b) => b[1] - a[1]) .map((e) => { secondTier[e[0]] = { value: e[1]["Total"] ?? e[1], category: d[0] }; Object.entries(e[1]) .filter((d) => d[0] !== "Total") .sort((a, b) => b[1] - a[1]) .map((e3) => { thirdTier[e3[0]] = { value: e3[1], category: d[0] }; }); }); }); const firstTierEntries = Object.entries(firstTier); const secondTierEntries = Object.entries(secondTier); const thirdTierEntries = Object.entries(thirdTier); let totalValue = 0; let cumulativeValues = []; firstTierEntries.map((e) => { totalValue += e[1].value; cumulativeValues.push({ [e[0]]: totalValue }); }); let secondTotalValue = 0; let secondCumulativeValues = []; secondTierEntries.map((e) => { secondTotalValue += e[1].value; secondCumulativeValues.push({ [e[0]]: secondTotalValue }); }); let thirdTotalValue = 0; let thirdCumulativeValues = []; thirdTierEntries.map((e) => { thirdTotalValue += e[1].value; thirdCumulativeValues.push({ [e[0]]: thirdTotalValue }); }); const placeHolderData = firstTierEntries.map((d) => d3.range(0, d[1].value)); const secondPlaceHolderData = secondTierEntries.map((d) => d3.range(0, d[1].value) ); const thirdPlaceHolderData = thirdTierEntries.map((d) => d3.range(0, d[1].value) ); const valueRange = d3.range(0, totalValue).filter((v) => v > 0); const cumulativeEntries = cumulativeValues.map((v) => Object.entries(v)); const secondValueRange = d3.range(0, secondTotalValue).filter((v) => v > 0); const secondCumulativeEntries = secondCumulativeValues.map((v) => Object.entries(v) ); const thirdValueRange = d3.range(0, thirdTotalValue).filter((v) => v > 0); const thirdCumulativeEntries = thirdCumulativeValues.map((v) => Object.entries(v) ); const cellOffsets = valueRange.map((v, vNdx) => ({ category: cumulativeEntries.find((e) => e[0][1] >= v)[0][0], x: vNdx % waffleProps.dimensions.width, y: Math.floor(vNdx / waffleProps.dimensions.width) + 1 })); const secondCellOffsets = secondValueRange.map((v, vNdx) => ({ category: secondCumulativeEntries.find((e) => e[0][1] >= v)[0][0], x: vNdx % waffleProps.dimensions.width, y: Math.floor(vNdx / waffleProps.dimensions.width) + 1 })); const thirdCellOffsets = thirdValueRange.map((v, vNdx) => ({ category: thirdCumulativeEntries.find((e) => e[0][1] >= v)[0][0], x: vNdx % waffleProps.dimensions.width, y: Math.floor(vNdx / waffleProps.dimensions.width) + 1 })); const cells = placeHolderData.map((p, pNdx) => { return p.map((v, vNdx) => ({ category: dataEntries[pNdx][0], x: vNdx % waffleProps.dimensions.width, y: Math.floor(vNdx / waffleProps.dimensions.width), yOffset: pNdx === 0 ? 0 : cellOffsets .filter( // look for the y value of the last item of the prior category (c) => c.category === dataEntries[pNdx - 1][0] ) .at(-1).y + pNdx })); }); console.log(secondTierEntries); const secondCells = secondPlaceHolderData.map((p, pNdx) => { return p.map((v, vNdx) => ({ category: secondTierEntries[pNdx][1]["category"], x: vNdx % waffleProps.dimensions.width, y: Math.floor(vNdx / waffleProps.dimensions.width), yOffset: pNdx === 0 ? 0 : secondCellOffsets .filter( // look for the y value of the last item of the prior category (c) => c.category === secondTierEntries[pNdx - 1][0] ) .at(-1).y + pNdx })); }); const thirdCells = thirdPlaceHolderData.map((p, pNdx) => { return p.map((v, vNdx) => ({ category: thirdTierEntries[pNdx][1]["category"], x: vNdx % waffleProps.dimensions.width, y: Math.floor(vNdx / waffleProps.dimensions.width), yOffset: pNdx === 0 ? 0 : thirdCellOffsets .filter( // look for the y value of the last item of the prior category (c) => c.category === thirdTierEntries[pNdx - 1][0] ) .at(-1).y + pNdx })); }); const xDomain = d3.range(0, waffleProps.dimensions.width); waffleProps.dimensions.height = Math.ceil( totalValue / waffleProps.dimensions.width ); const yDomain = d3.range(0, waffleProps.dimensions.height * 1.65); const xScale = d3.scaleBand(xDomain, [ dimensions.margin, (dimensions.width - dimensions.margin) / dataDepth ]); const yScale = d3.scaleBand(yDomain, [ dimensions.height - dimensions.margin, dimensions.margin ]); const svg = d3 .create("svg") .attr("width", dimensions.width) .attr("height", dimensions.height); if (axes.axisLeft.show) { svg .append("g") .attr("transform", `translate(${dimensions.margin}, 0)`) .attr("class", "axis") .call( d3 .axisLeft(yScale) .tickArguments([axes.axisLeft.tickCount, axes.axisLeft.tickFormat]) ); svg .append("text") .attr("class", "axisLabel left") .attr("text-anchor", "end") .attr("dy", ".75em") .attr("transform", "rotate(-90)") .attr("x", -dimensions.margin) .text(axes.axisLeft.label); } const axisPath = svg.selectAll(".axis .domain"); const axisTickLine = svg.selectAll(".axis .tick").selectAll("line"); const axisTickText = svg.selectAll(".axis .tick").selectAll("text"); const axisLabel = svg.selectAll(".axisLabel"); const axisLineStyleArray = Object.entries(axisStyle.lines); const axisFontStyleArray = Object.entries(axisStyle.font); const axisLabelStyleArray = Object.entries(axisLabelStyle); axisLineStyleArray.map((s) => { axisPath.style(s[0], s[1]); axisTickLine.style(s[0], s[1]); }); axisFontStyleArray.map((s) => { axisTickText.style(s[0], s[1]); }); axisLabelStyleArray.map((s) => { axisLabel.style(s[0], s[1]); }); svg .append("text") .text(title) .attr("fontSize", titleStyle["font-size"]) .attr("class", "title") .attr("y", dimensions.margin * (2 / 3)); const titleStyleArray = Object.entries(titleStyle); const titleText = svg.selectAll(".title"); titleStyleArray.map((t) => { titleText.style(t[0], t[1]); }); // last, add the cells cells.map((group, gNdx) => { svg .append("g") .attr("class", "firstTier") .selectAll("rect") .data(group) .join("rect") .attr("class", "rect") .attr("x", (d) => waffleProps.align === "left" ? xScale(d.x) : dimensions.width / dataDepth - xScale(d.x) ) .attr("id", (d, dNdx) => `${dNdx}`) .attr("y", (d) => dimensions.height - yScale(d.y + d.yOffset)) .attr("transform", (d) => { return `translate(0,${ dataEntries.indexOf(dataEntries.find((e) => e[0] === d.category)) * yScale.bandwidth() })`; }) .attr("height", yScale.bandwidth()) .attr("width", xScale.bandwidth()) .attr("fill", (d) => { return d3.interpolateRainbow( dataEntries.indexOf(dataEntries.find((e) => e[0] === d.category)) / dataEntries.length ); }) .attr("stroke", (d) => { return d3.interpolateRainbow( firstTierEntries.indexOf( firstTierEntries.find((e) => e[0] === d.category) ) / firstTierEntries.length ); }); }); if (waffleProps.labels) { firstTierEntries.map((d, dNdx) => { svg .append("text") .text(`${d[0]}: ${valueCalc(d[1].value)}`) .attr("x", dimensions.margin) .attr("text-anchor", "beginning") .attr( "y", dimensions.height - yScale(cells[dNdx][0]["y"] + cells[dNdx][0]["yOffset"]) ) .attr( "transform", `translate(0,${ firstTierEntries.indexOf( firstTierEntries.find((e) => e[0] === d[0]) ) * yScale.bandwidth() })` ); }); } if (dataDepth >= 2) { secondCells.map((group, gNdx) => { svg .append("g") .attr("class", "secondTier") .selectAll("rect") .data(group) .join("rect") .attr("class", "rect") .attr("x", (d) => waffleProps.align === "left" ? xScale(d.x) + (1 / dataDepth) * dimensions.width : dimensions.width * (1 / dataDepth) - xScale(d.x) ) .attr("id", (d, dNdx) => `${dNdx}`) .attr("y", (d) => dimensions.height - yScale(d.y + d.yOffset)) .attr("transform", (d) => { return `translate(0,${ secondTierEntries.indexOf( secondTierEntries.find((e) => e[0] === d[0]) ) * yScale.bandwidth() })`; }) .attr("height", yScale.bandwidth()) .attr("width", xScale.bandwidth()) .attr("fill", (d) => { return d3.interpolateRainbow( dataEntries.indexOf(dataEntries.find((e) => e[0] === d.category)) / dataEntries.length ); }) .attr("stroke", (d) => { return d3.interpolateRainbow( firstTierEntries.indexOf( firstTierEntries.find((e) => e[0] === d.category) ) / firstTierEntries.length ); }); }); if (waffleProps.labels) { secondTierEntries.map((d, dNdx) => { svg .append("text") .text(`${d[0]}: ${valueCalc(d[1].value)}`) .attr("x", dimensions.margin + dimensions.width * (1 / dataDepth)) .attr("text-anchor", "beginning") .attr( "y", dimensions.height - yScale( secondCells[dNdx][0]["y"] + secondCells[dNdx][0]["yOffset"] ) ); // .attr( // "transform", // `translate(0,${ // secondTierEntries.indexOf( // secondTierEntries.find((e) => e[0] === d[0]) // ) * yScale.bandwidth() // })` // ); }); } } if (dataDepth === 3) { thirdCells.map((group, gNdx) => { svg .append("g") .attr("class", "thirdTier") .selectAll("rect") .data(group) .join("rect") .attr("class", "rect") .attr("x", (d) => waffleProps.align === "left" ? xScale(d.x) + (2 / dataDepth) * dimensions.width : dimensions.width / dataDepth - xScale(d.x) ) .attr("id", (d, dNdx) => `${dNdx}`) .attr("y", (d) => dimensions.height - yScale(d.y + d.yOffset)) .attr("transform", (d) => { return `translate(0,${ thirdTierEntries.indexOf( thirdTierEntries.find((e) => e[0] === d[0]) ) * yScale.bandwidth() })`; }) .attr("height", yScale.bandwidth()) .attr("width", xScale.bandwidth()) .attr("fill", (d) => { return d3.interpolateRainbow( dataEntries.indexOf(dataEntries.find((e) => e[0] === d.category)) / dataEntries.length ); }) .attr("stroke", (d) => { return d3.interpolateRainbow( dataEntries.indexOf(dataEntries.find((e) => e[0] === d.category)) / dataEntries.length ); }); }); if (waffleProps.labels) { thirdTierEntries.map((d, dNdx) => { svg .append("text") .text(`${d[0]}: ${valueCalc(d[1].value)}`) .attr("x", dimensions.margin + dimensions.width * (2 / dataDepth)) .attr("text-anchor", "beginning") .attr( "y", dimensions.height - yScale(thirdCells[dNdx][0]["y"] + thirdCells[dNdx][0]["yOffset"]) ); // .attr( // "transform", // `translate(0,${ // thirdTierEntries.indexOf( // thirdTierEntries.find((e) => e[0] === d[0]) // ) * yScale.bandwidth() // })` // ); }); } } // apply the standard style to the elements const styleArray = Object.entries(elementStyle); styleArray.map((s) => { svg.selectAll("rect").style(s[0], s[1]); }); // apply the threshold style to the elements if (threshold.show) { const thresholdCircles = svg.selectAll(".threshold"); const thresholdStyle = Object.entries(threshold.style); thresholdStyle.map((t) => { thresholdCircles.style(t[0], t[1]); }); } return svg.node(); }49:T4d5,function thresholdChecker(dValue, showThreshold, thresholdValue, criteria,) { const multiValues = Array.isArray(thresholdValue) const value = dValue const threshold = thresholdValue let sortedThreshold = [] if (multiValues) { sortedThreshold[0] = Math.min( threshold[0],threshold[1] ) sortedThreshold[1] = Math.max( threshold[0],threshold[1] ) } if (showThreshold) { switch(criteria) { case ">": { if (value > threshold) return 'threshold' } break; case "<": { if (value < threshold) return 'threshold' } break; case "<=": { if (value <= threshold) return 'threshold' } break; case ">=": { if (value >= threshold) return 'threshold' } break; case "><": { if (value > sortedThreshold[0] && value < sortedThreshold[1]) return 'threshold' } break; case "<>": { if (value < sortedThreshold[0] || value > sortedThreshold[1]) return 'threshold' } break; case "===": { if (multiValues) { if ( value === threshold[0] ) { return 'threshold' } else if ( value === threshold[1] ) { return 'subtle' } } else if ( value === threshold ) return 'threshold' } break; } } else return; } 4a:T78f0,// Custom SVG Shapes handDrawn = svg` `4b:[] 45:{"id":"e5943a17424479a1","slug":"grouped-waffle-chart-single-shape-per-category","title":"Grouped Waffle Chart - single shape per category","thumbnail":"e4bcf681a29b337a5516cfe923394fbe5c797a443f8993217c74cddf2171ce55","access_level":"public","create_time":"$D2021-10-28T16:16:49.559Z","update_time":"$D2021-11-12T04:33:22.647Z","view_time":null,"first_public_time":"$D2021-10-28T17:10:54.586Z","has_unpublished_edits":null,"fork":{"id":"c5eecad32d26f60e","slug":"waffle-chart","title":"Waffle Chart","owner":{"id":"4980cc230c98941f","login":"jasper","name":"Jasper Croome"}},"stars":0,"starred":false,"owner":{"type":"team","id":"4980cc230c98941f","login":"jasper","name":"Jasper Croome","avatar_url":"https://avatars-next.observableusercontent.com/608473607665cc282deb36830ffc0c0456605281332fdcb460041f875772ba68","tier":"starter_2024","bio":"Hi! I'm a Design Technologist based in Portland, Oregon (USA). ","following":false},"version":1434,"publish_version":1434,"role":null,"authored":false,"authors":[{"type":"individual","id":"4520200087dbe52b","login":"jasper","name":"Jasper Croome","avatar_url":"https://avatars-next.observableusercontent.com/608473607665cc282deb36830ffc0c0456605281332fdcb460041f875772ba68","tier":null,"bio":"Hi! I'm a Design Technologist based in Portland, Oregon (USA). ","following":false}],"members":[{"type":"individual","id":"4520200087dbe52b","login":"jasper","name":"Jasper Croome","avatar_url":"https://avatars-next.observableusercontent.com/608473607665cc282deb36830ffc0c0456605281332fdcb460041f875772ba68","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":3,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Grouped Waffle Chart - single shape per category","cells":[{"id":0,"value":"# Grouped Waffle Chart - single shape per category\n\nThis is a Grouped Waffle Chart, generally used to visualize the contribution of various groups to the value of one larger group. This is different from the basic waffle chart in that each category is grouped together into one shape, to aid in readability and simplify the message (\"these parts make up that whole.\")\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":757,"value":"## 1. Declare your Data\n\nThis is where you would declare data as whatever you want to graph. For this chart, it needs to have a key-value pairing for each category, à la: \n\n```\n{\"Energy\": {\n \"Total\":73.2,\n \"Energy Use in Industry\":{\n \"Total\":24.2,\n \"Iron and Steel\":7.2,\n \"Non-Ferrous Metals\":0.7,\n \"Chemical & Petrochemical\":3.6,\n \"Food & Tobacco\":1,\n \"Paper & Pulp\":0.6,\n \"Machinery\":0.5,\n \"Other Industry\":10.6\n }\n}}\n```\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":195,"value":"$47","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1272,"value":"viewof waffleWidth = Inputs.range([0, 100], { label: \"Waffle Width\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1278,"value":"viewof waffleAlign = Inputs.radio([\"left\", \"right\"], {\n label: \"Align Cells to Left or Right\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1285,"value":"viewof waffleLabels = Inputs.toggle({ label: \"Show Group Labels\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1339,"value":"viewof dataDepth = Inputs.range([1, 5], { label: \"Data Depth\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1333,"value":"valueCalc = (n) => `${(n / 10000) * 494}`.substring(0, 4) + ` gigatons` // this converts the values in the data object to gigatons","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"$48","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1220,"value":"**Anything below this box is maintenance-related, and doesn't directly change the experience of the grouped Waffle Chart**\n\n(apart from maybe breaking it)\n____","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":295,"value":"// This is where you declare what the threshold is (if there is one), and whether or not to display it. An example is provided below.\nthreshold = Object({\n show: false, // toggles whether or not to show\n showIndicator: false,\n target: \"y\", // can be x, y, z or category\n criteria: \">\", // can be any combination of '>','=','<', or '===' for string comparison\n value: \"75000\", // can either be one value or two (for comparing against a range, e.g. 'between 3.4 and 4.2' would be 'value: [3.4, 4.2]')\n drawingStyle: \"brush\", // choose brush, pencil, or computer\n style: { fill: \"salmon\" }, // the style passed through to any of the elements\n indicatorStyle: {\n stroke: \"#858585\"\n } // the style for the indicator line (if shown)\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1061,"value":"waffleProps = Object({\n dimensions: {\n width: waffleWidth ?? 25\n },\n labels: waffleLabels,\n align: waffleAlign ?? \"left\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":319,"value":"$49","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":114,"value":"dimensions = Object({ height: 800, width: innerWidth, margin: 40 })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"//\n\naxes = Object({\n axisLeft: {\n show: false\n },\n axisBottom: {\n show: false\n },\n axisRight: { show: false }, // for now, this does nothing\n axisTop: { show: false } // samesies\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":244,"value":"axisStyle = Object({\n lines:{\n stroke:'#858585',\n 'stroke-width':'1px'\n },\n font:{\n 'font-size':'16px',\n 'font-weight':400,\n 'fill':'#858585',\n 'stroke-width':'1px',\n 'font-family':'helvetica',\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":568,"value":"axisLabelStyle = Object({\n 'font-weight':400,\n 'font-size':'20',\n 'font-family':'helvetica',\n 'fill':'#6F6F6F'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":544,"value":"titleStyle = Object({\n 'font-size':'31.25px',\n 'font-weight':400,\n 'font-family':'helvetica, sans-serif',\n 'fill':'#707070'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"// the basic style for elements within the chart\nelementStyle = Object({\n \"stroke-width\": \".5px\",\n // fill: \"#1D874E\",\n stroke: \"whitesmoke\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":542,"value":"title = `Sample Grouped Waffle Chart - Vertical Sort, Aligned ${waffleAlign}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":805,"value":"$4a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4b","stdlib":"1"}} 46:"$45:body"