27:null 28:["$","title",null,{"children":"Concrete Circular Sankey | RPI CASE | Observable"}] 2d:T8a7,viewof concreteSankey = { const height = 500 const percent = d3.format('.0%') const count = d3.format(',d') const svg = d3.select(DOM.svg(width, height)) .style('width', '100%') .style('height', 'auto') const layout = d3.sankey() .extent([[100, 1], [width-60, height]]) const diagram = d3.sankeyDiagram() .nodeTitle(d => `${d.id}: ${count(d.value)}`) .linkTitle(d => { }) .linkColor(d => (d.value / d.source.value) < 0.05 ? d3.schemePaired[0] : d3.schemePaired[1]) .on('selectLink', d => svg.property('value', d).dispatch('input')) .on('selectNode', d => svg.property('value', d).dispatch('input')) svg .datum(layout(concreteData)) .call(diagram) const tooltip = d3.select("body").append("div") .attr("class", "tooltip") .style("position", "absolute") .style("padding", "6px 10px") .style("background", "#fff") .style("border", "1px solid #ccc") .style("border-radius", "4px") .style("pointer-events", "none") .style("box-shadow", "0 2px 4px rgba(0,0,0,0.15)") .style("display", "none"); svg.selectAll(".link") .on("mouseover", (event, d) => { tooltip .html(`

${d.source.id} → ${d.target.id}

${count(d.value)} (${percent(d.value / d.source.value)})

${d.note || ''}

${d.source.id} → ${d.target.id}

${count(d.value)} (${percent(d.value / d.source.value)})

${d.note || ''}

`) .style("left", (event.pageX + 10) + "px") .style("top", (event.pageY - 28) + "px") .style("display", "block"); }) .on("mousemove", (event) => { tooltip .style("left", (event.pageX + 10) + "px") .style("top", (event.pageY - 28) + "px"); }) .on("mouseout", () => { tooltip.style("display", "none"); }); svg.selectAll('g.link') .append('text') .attr('x', d => d.points[0].x) .attr('y', d => d.points[0].y) .attr('dy', 3) .attr('dx', 2) .text(d => `${count(d.value)} (${percent(d.value / d.source.value)})`) return svg.node() }30:T5f7,concreteData = { const nodeIds = [ "Portland Cement", "Water", "Limestone", "Sand", "Gravel", "Mixing", "Aggregate", "Molding", "Curing", "CMU", "Kiln", "Gypsum", "Use", "Disposal", "Recycling", "Landfill", "CO2 Emissions", "Clay" ]; const nodes = nodeIds.map(id => ({ id })); const links = [ ["Portland Cement", "Mixing", 15, "Cement is mixed in."], ["Kiln", "Portland Cement", 14, "Heated raw materials form clinker."], ["Gypsum", "Portland Cement", 1, "Additive to cement."], ["Limestone", "Kiln", 9, "Primary raw material for clinker."], ["Clay", "Kiln", 5, "Provides alumina and silica."], ["Sand", "Aggregate", 23, "Fine aggregate component."], ["Gravel", "Aggregate", 43, "Coarse aggregate component."], ["Aggregate", "Mixing", 80, "Combined into the concrete mix."], ["Mixing", "Molding", 100, "Placed into block molds."], ["Molding", "Curing", 100, "Hardening over time."], ["Curing", "CMU", 100, "Final concrete masonry unit."], ["CMU", "Use", 100, "In-use phase."], ["Use", "Disposal", 100, "End-of-life phase."], ["Disposal", "Recycling", 14, "Recycled into aggregate for new material."], ["Disposal", "Landfill", 86, "CMU is usually sent to a landfill rather than reprocessed."], ["Recycling", "Aggregate", 14, "Recycled material can be put back into aggregates."], ["Water", "Mixing", 5, "Triggers the concrete reaction."] ].map(([source, target, value, note]) => ({ source, target, value, note })); return { nodes, links }; }31:T7bc,bioconcreteData = { const nodeIds = [ "Biocement", "Water", "Limestone", "Sand", "Gravel", "Mixing", "Aggregate", "Molding", "Curing", "Bioconcrete", "Kiln", "Gypsum", "Use", "Disposal", "Recycling", "Landfill", "Waste Material", "CO2 Emissions", "Clay", "Bacteria", "Urea and Ammonia", "Recycled Aggregate", "Reuse" ]; const nodes = nodeIds.map(id => ({ id })); const links = [ ["Biocement", "Mixing", 12, "Biocement replaces Portland Cement as the mineral binder."], ["Sand", "Aggregate", 12, "Sand creates aggregate."], ["Gravel", "Aggregate", 23, "Gravel creates aggregate."], ["Aggregate", "Mixing", 85, "Combined aggregate forms the base of bioconcrete."], ["Mixing", "Molding", 100, "The mixed material is formed in molds."], ["Molding", "Curing", 100, "Molded units cure through a bacterial reaction."], ["Curing", "Bioconcrete", 100, "Bioconcrete cures in 48 hours at ambient temperatures."], ["Bioconcrete", "Use", 100, "Bioconcrete can be used in non-structural purposes."], ["Use", "Disposal", 100, "Bioconcrete is not fundamentally different from concrete."], ["Disposal", "Recycling", 30, "Portion of bioconcrete is recycled."], ["Disposal", "Landfill", 20, "Some waste ends up in landfill."], ["Disposal", "Reuse", 50, "Reused directly without reprocessing."], ["Recycling", "Recycled Aggregate", 30, "Recycling produces reusable aggregate."], ["Recycled Aggregate", "Aggregate", 50, "Recycling produces reusable aggregate."], ["Water", "Biocement", 5, "Water feeds the bacterial solution."], ["Bacteria", "Biocement", 5, "Bacteria through MICP produces calcium carbonate to bind aggregate."], ["Waste Material", "Recycled Aggregate", 20, "Industrial waste can be used as aggregate."], ["Urea and Ammonia", "Biocement", 5, "Nutrients for bacterial growth in biocement."] ].map(([source, target, value, note]) => ({ source, target, value, note })); return { nodes, links }; }32:[] 2b:{"id":"9870fc4d422afaf9","slug":null,"title":"Concrete Circular Sankey","thumbnail":"99589c6dbb0e37b00de06a9a8317bc90fd87db96a874352b4f261ce4e812353e","access_level":"public","create_time":"$D2025-04-06T18:29:08.777Z","update_time":"$D2025-04-14T14:54:47.159Z","view_time":null,"first_public_time":"$D2025-04-06T18:29:08.777Z","has_unpublished_edits":null,"fork":{"id":"650a7e2948c82957","slug":"xls-circular-sankey-forked","title":"clx circular sankey (forked)","owner":{"id":"fcd7e4188e1df970","login":"bumbeishvili","name":"David B."}},"stars":0,"starred":false,"owner":{"type":"team","id":"743d5a6594d2f885","login":"rpi-case2","name":"RPI CASE","avatar_url":"https://avatars-next.observableusercontent.com/c3efd859c31a42c0f3fb1589e47cf4476bdaf6e22c6113e5ba1946665586b8b5","tier":"starter_2024"},"version":1327,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"efd5923a0ca1675b","login":"jayden-huang","name":"Jayden Huang","avatar_url":"https://avatars-next.observableusercontent.com/f5922b54b023c19fed353158f1b23b6233162ded8156cc2d7d23916173a0280c","tier":null}],"members":[{"type":"individual","id":"efd5923a0ca1675b","login":"jayden-huang","name":"Jayden Huang","avatar_url":"https://avatars-next.observableusercontent.com/f5922b54b023c19fed353158f1b23b6233162ded8156cc2d7d23916173a0280c","tier":null,"role":"editor"},{"type":"team","id":"743d5a6594d2f885","login":"rpi-case2","name":"RPI CASE","avatar_url":"https://avatars-next.observableusercontent.com/c3efd859c31a42c0f3fb1589e47cf4476bdaf6e22c6113e5ba1946665586b8b5","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Concrete Circular Sankey","cells":[{"id":1233,"value":"md`# Concrete Circular Sankey`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1192,"value":"md`## Concrete Masonry Unit`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1196,"value":"$2d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1275,"value":"$2e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1204,"value":"md`## Bioconcrete`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1206,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":662,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1198,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1276,"value":"concreteEmissionsData = {\n const nodeIds = [\n \"Portland Cement\",\n \"Water\",\n \"Limestone\",\n \"Sand\",\n \"Gravel\",\n \"Mixing\",\n \"Aggregate\",\n \"Molding\",\n \"Curing\",\n \"CMU\",\n \"Kiln\",\n \"Gypsum\",\n \"Use\",\n \"Disposal\",\n \"Recycling\",\n \"Landfill\",\n \"Transport\",\n \"CO2 Emissions\"\n ];\n\n const nodes = nodeIds.map(id => ({ id }));\n\n const links = [\n [\"Portland Cement\", \"CO2 Emissions\", 65],\n [\"Aggregate\", \"CO2 Emissions\", 8],\n [\"Mixing\", \"CO2 Emissions\", 5],\n [\"Transport\", \"CO2 Emissions\", 10],\n [\"Molding\", \"CO2 Emissions\", 8],\n [\"Recycling\", \"CO2 Emissions\", 4]\n ].map(([source, target, value]) => ({ source, target, value }));\n\n return { nodes, links };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1201,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":163,"value":"md`---\n\n#### Libraries`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"import { lever, vegalite } from '@visnup/lever'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":238,"value":"d3 = require('d3', 'd3-sankey-diagram')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"_ = require('lodash')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 2c:"$2b:body"