2a:null 2b:["$","title",null,{"children":"Humanitarian Aid Recipients | Marjolein Oostrom | Observable"}] 31:T2409,chart = { //colors used var background_color = "#f2f3f4" var highlight_color = "#D79922" var outline_color = "#4056A1" var center_circle_color = "#C5CBE3" var font_color = '#303C6C' var fontsize = d3.scaleSqrt() .domain([0, 150]) .range([5, 20]) .clamp(true) const root = packWithMapChildren(data_total); // B) Final approach //https://observablehq.com/d/ea342ae19603b9a0 let focus = root; console.log(root) let view; var current_title = "Click to Zoom" const svg = d3.create("svg") .attr("viewBox", `-${width / 2} -${height /(2)} ${width} ${height}`) .style("display", "block") .style("margin", "0 0px") .style("background", background_color) //.style("cursor", "pointer") .on("mouseover", (event) => (svgMouseOut(event, root))) // tooltip + styling const toolTip = d3.select("body") .append("div") .attr("class", "toolTip") .style("position", "absolute") .style("display", "none") .style("border-radius", "1px") .style("width", width/3) .style("height", "auto") .style("background", background_color) .style("padding", "0px") .style("border", "1px solid #DDD") .style("font-size", "1.1rem") .style("text-align", "left") //https://stackoverflow.com/questions/149055/how-to-format-numbers-as-currency-strings // Create our number formatter. var formatter = new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD', notation: 'compact', // These options are needed to round to whole numbers if that's what you want. //minimumFractionDigits: 0, // (this suffices for whole numbers, but will print 2500.10 as $2,500.1) //maximumFractionDigits: 0, // (causes 2500.99 to be printed as $2,501) }); var startTime; var endTime; const node = svg.append("g") .selectAll("circle") //.data(root) .data(root.descendants().slice(1)) .join("circle") .attr("fill", d => d.children ? background_color : toTitleCase(String(d.data[0])) == toTitleCase(String(recipientdrop)) ? highlight_color : center_circle_color) .attr("stroke", d=> d.children ? highlight_color : toTitleCase(String(d.data[0])) == toTitleCase(String(recipientdrop)) ? highlight_color : outline_color) .attr("stroke-width", 1) // .on('touchdown', function() { startTime = new Date(); }) // .on('touchup',function(event, d) { // endTime = new Date(); // (((endTime - startTime) > 1000) && focus !== d) ? (zoom(d), event.stopPropagation()) : console.log(d)}) //event.stopPropagation stops the mouseover //being used to trigger a background event .on("mouseover", (event, d) => (leafMouseOver(event, d), event.stopPropagation())) .on("mouseout", (event, d) => (leafMouseOut(event, d), event.stopPropagation())) .on("click", (event, d) => focus !== d ? (zoom(d)) : console.log(d)) .on("touchstart", (event, d) => focus !== d ? (leafMouseOver(event, d)) : console.log(d)) .on("touchend", (event, d) => focus !== d ? (leafMouseOut(event, d), zoom(d)) : console.log(d)) // show tooltip on mousehover function leafMouseOver(event, d){ d3.selectAll('.toolTip').style("display", "none" ) d3.select(event.target).attr("stroke-width", 10) d3.select(event.target).attr("stroke", highlight_color) var formated_money =parseFloat(d.value)*parseFloat(dd3)/root.value var formated_money = formatter.format(formated_money) var raw_money = formatter.format(parseFloat(d.value)) var descendents = d.ancestors().map(d => (d.data[0])).join(' -> ') toolTip .style("left", (width - d3.select(event.target).attr("cx")) < width/3 ? event.pageX - width/3 + "px": event.pageX + "px") .style("top", event.pageY + 10 + "px") .style("display", "block") .html(` ${toTitleCase(String(d.data[0]))}
Your taxes provide : ${formated_money}
Total money : ${raw_money}
Click to zoom in`) } function svgMouseOut(event, d){ d3.selectAll('.toolTip').style("display", "none" ) d3.selectAll('.title_desc').style("display", "none" ) } function leafMouseOut(event, d){ d3.select(event.target).attr("stroke", d=> d.children ? highlight_color : d.data[0] == recipientdrop ? highlight_color : outline_color) d3.select(event.target).attr("stroke-width", d=> d.data[0] == recipientdrop ? 3 : 1) //toolTip.style("display", "none" ); } const label = svg.append("g") .style("font", "10px sans-serif") .attr("text-anchor", "middle") .selectAll("text") .data(root.descendants()) .join("text") .style("fill-opacity", d => d.parent === root ? 1 : 0) .style("display", d => d.parent === root ? "inline" : "none") .text(d => toTitleCase(String(d.data[0])).substring(0, 30) + "...") // .on('touchdown', function() { startTime = new Date(); }) // .on('touchup',function(event, d) { // endTime = new Date(); // (((endTime - startTime) > 1000) && focus !== d) ? (zoom(d), event.stopPropagation()) : console.log(d)}) // .on("click", (event, d) => focus !== d ? (zoom(d), event.stopPropagation()) : console.log(d)) const node_international_affairs = node //.attr("test", d => console.log(d.descendants().map(d => (d.data[0])))) .filter(function(d, i) { return d.data[0] == "International Affairs: Budget Function" }) .filter(function(d, i) { return i == 0 }) console.log(node_international_affairs ) if (first_item === recipientdrop) { zoom(root); } else { node_international_affairs .each(function(d) { zoom(d); // d is datum temp_highlight() }) } function temp_highlight(){ node_international_affairs .each(function(d) { zoom(d) // d is datum }) console.log(recipientdrop) const node_selected = node //.attr("test", d => console.log(d.descendants().map(d => (d.data[0])))) .filter(function(d, i) { return d.data[0] == recipientdrop }) console.log(node_selected) node_selected .attr("stroke-width", 20) .attr('stroke-opacity', .8) } function zoomTo(v) { console.log(v) const k = width / v[2]; view = v; label.attr("transform", d => d == focus ? `translate(-${0}, -${height * .9 /(2)})` : `translate(${(d.x - v[0]) * k},${(d.y - v[1]) * k})`) .attr("font-size", d => fontsize(d.r * k)) .style("fill-opacity", d =>d.parent == focus ? 1 : d == focus && d != root ? .9 : 0) .style("display", d => fontsize(d.r * k) < 10 ? "none": (d.parent == focus | d == focus) ? "inline" : "none") node.attr("transform", d => `translate(${(d.x - v[0]) * k},${(d.y - v[1]) * k})`); node.attr("r", d => d.r * k) } function zoom(d) { console.log("zoom") console.log(d) const focus0 = focus; if (d != focus && d.height == 0){ d = d.parent.parent } if (d != focus && d.height == 1){ d = d.parent } // if (d != focus && d.depth != 1) { // if (d.parent){ // if (d.parent.children.length == 1){ // d = d.parent // if (d.parent){ // if (d.parent.children.length == 1){ // d = d.parent // if (d.parent){ // if (d.parent.children.length == 1){ // d = d.parent // } // } // } // } // } // }} focus = d; console.log(focus) current_title = focus.data[0] console.log(current_title) if (focus0 !=focus | focus == root){ zoomTo([focus.x, focus.y, focus.r * 2])} } var title1 = svg.append("text") .attr("x", width / 2 - 100)//`-${width / 2} - 200`) .attr("y", -height /2 + 100 )//`-${height / 2} - 200`) .attr("text-anchor", "middle") .style("cursor", "pointer") .style("font-size", "18px") // .on("click", (event, d) => (temp_highlight(), event.stopPropagation()) ) .attr('font-weight', 500) .style("display", d => recipientdrop != first_item ? "inline" : "none") .text("Highlight Selected") .on("mouseover", (event, d) => (d3.select(event.target).style("font-weight", "bold"), temp_highlight(), event.stopPropagation()) ) .on("mouseout", (event, d) => d3.select(event.target).style("font-weight", "normal")) var title2 = svg.append("text") .attr("x", width / 2 - 100)//`-${width / 2} - 200`) .attr("y", -height /2 + 50 )//`-${height / 2} - 200`) .attr("text-anchor", "middle") .style("cursor", "pointer") .style("font-size", "18px") // .on("click", (event, d) => (zoom(root), event.stopPropagation()) ) .attr('font-weight', 600) .text("Zoom Out") .on("mouseover", (event, d) => (d3.select(event.target).style("font-weight", 900), zoom(root), event.stopPropagation())) .on("mouseout", (event, d) => d3.select(event.target).style("font-weight", 600)) return svg.node(); }32:T173e,// chart2 = { // //colors used // var background_color = "#f2f3f4" // var highlight_color = "#D79922" // var outline_color = "#4056A1" // var center_circle_color = "#C5CBE3" // var font_color = '#303C6C' // var fontsize = d3.scaleSqrt() // .domain([0, 150]) // .range([1, 20]) // .clamp(true) // const root = packWithMapChildren(data_total); // B) Final approach //https://observablehq.com/d/ea342ae19603b9a0 // let focus = root; // console.log(root) // let view; // function toTitleCase(str) { // return str.replace( // /\w\S*/g, // function(txt) { // return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); // } // ); // } // const svg = d3.create("svg") // .attr("viewBox", `-${width / 2} -${height / 2} ${width} ${height}`) // .style("display", "block") // .style("margin", "0 -14px") // .style("background", background_color) // //.style("cursor", "pointer") // .on("click", (event) => zoom(root)) // .on("mouseover", (event) => svgMouseOut(event, root)) // // tooltip + styling // const toolTip = d3.select("body") // .append("div") // .attr("class", "toolTip") // .style("position", "absolute") // .style("display", "none") // .style("border-radius", "1px") // .style("width", "200px") // .style("height", "auto") // .style("background", background_color) // .style("padding", "0px") // .style("border", "1px solid #DDD") // .style("font-size", ".9rem") // .style("text-align", "left") // //https://stackoverflow.com/questions/149055/how-to-format-numbers-as-currency-strings // // Create our number formatter. // var formatter = new Intl.NumberFormat('en-US', { // style: 'currency', // currency: 'USD', // notation: 'compact', // // These options are needed to round to whole numbers if that's what you want. // //minimumFractionDigits: 0, // (this suffices for whole numbers, but will print 2500.10 as $2,500.1) // //maximumFractionDigits: 0, // (causes 2500.99 to be printed as $2,501) // }); // const node = svg.append("g") // .selectAll("circle") // //.data(root) // .data(root.descendants().slice(1)) // .join("circle") // .attr("fill", d => d.children ? background_color : toTitleCase(String(d.data[0])) == toTitleCase(String(recipientdrop)) ? highlight_color : d.data[0] == min_name[0] ? highlight_color: center_circle_color) // .attr("stroke", d=> d.children ? highlight_color : toTitleCase(String(d.data[0])) == toTitleCase(String(recipientdrop)) ? highlight_color : d.data[0] == min_name[0] ? highlight_color: outline_color) // .attr("stroke-width", d => d.data[0] == min_name[0] ? 10: 1) // .on("click", (event, d) => focus !== d ? (zoom(d), event.stopPropagation()) : console.log(d)) // //event.stopPropagation stops the mouseover // //being used to trigger a background event // .on("mouseover", (event, d) => (leafMouseOver(event, d), event.stopPropagation())) // .on("mouseout", (event, d) => (leafMouseOut(event, d), event.stopPropagation())) // // show tooltip on mousehover // function leafMouseOver(event, d){ // d3.selectAll('.toolTip').style("display", "none" ) // d3.select(event.target).attr("stroke-width", 10) // d3.select(event.target).attr("stroke", highlight_color) // var formated_money =parseFloat(d.value)*parseFloat(dd3)/root.value // var formated_money = formatter.format(formated_money) // var raw_money = formatter.format(parseFloat(d.value)) // toolTip.style("left", (width - event.pageX) < 400 ? event.pageX - 250 + "px": event.pageX + 50 + "px") // .style("top", event.pageY + "px") // .style("display", "block") // .html(` // ${toTitleCase(String(d.data[0]))}
// Your taxes provide : ${formated_money}
// Total money : ${raw_money}
// Double click to zoom into this circle`) // } // function svgMouseOut(event, d){ // d3.selectAll('.toolTip').style("display", "none" ) // } // function leafMouseOut(event, d){ // d3.select(event.target).attr("stroke", d=> d.children ? highlight_color : d.data[0] == recipientdrop ? highlight_color : outline_color) // d3.select(event.target).attr("stroke-width", d=> d.data[0] == recipientdrop ? 3 : 1) // //toolTip.style("display", "none" ); // } // const label = svg.append("g") // .style("font", "10px sans-serif") // .attr("text-anchor", "middle") // .selectAll("text") // .data(root.descendants()) // .join("text") // .style("fill-opacity", d => d.parent === root ? 1 : 0) // .style("display", d => d.parent === root ? "inline" : "none") // .text(d => toTitleCase(String(d.data[0])).substring(0, 30) + "...") // .on("click", (event, d) => focus !== d ? (zoom(d), event.stopPropagation()) : console.log(d)) // zoom(root) // function zoomTo(v) { // console.log(v) // const k = width / v[2]; // view = v; // label.attr("transform", d => `translate(${(d.x - v[0]) * k},${(d.y - v[1]) * k})`) // .attr("font-size", d => fontsize(d.r * k)) // .style("fill-opacity", d =>d.parent == focus ? 1 : 0) // .style("display", d => fontsize(d.r * k) < 10 ? "none": d.parent == focus ? "inline" : "none") // node.attr("transform", d => `translate(${(d.x - v[0]) * k},${(d.y - v[1]) * k})`); // node.attr("r", d => d.r * k); // } // function zoom(d) { // const focus0 = focus; // if (!d.children) { // console.log("children") // console.log(d.children) // d = d.parent // console.log(d) // } // focus = d; // zoomTo([focus.x, focus.y, focus.r * 2]) // } // return svg.node(); // }33:T4fc,//sum of account balances for all acounts, with sum awards for international affairs subtracted, resulting in recipients "federal_acount_name" for federal acounts not in international affaris, and "non-awards" for international affairs account obligations minus award obligations sum_all_accounts = { const left = d3.group(csv_account_balances, d => d.federal_account_symbol); const right = d3.group(subtract_all_awards, d => d.federal_account_symbol); return Array.from(left).flatMap(([key, lvalues]) => { //use "none" as placeholder for no match in awards summary // left join uisng https://talk.observablehq.com/t/how-to-left-join-csv-files/2604 return d3.cross(lvalues, right.get(key) || ["none"], (lvalue, rvalue) => { return {federal_account_symbol: lvalue.federal_account_symbol, federal_account_name: lvalue.federal_account_name, owning_agency_name: lvalue.owning_agency_name, budget_subfunction: lvalue.budget_subfunction, budget_function: lvalue.budget_function, value: rvalue.transaction_obligated_amount? Number(lvalue.obligations_incurred - rvalue.transaction_obligated_amount): Number(lvalue.obligations_incurred), recipient_name: rvalue.transaction_obligated_amount? "Non-Award Funds": lvalue.federal_account_name}; }); }); }34:[{"id":"5e9a74fdc50e9e55eda946f2f024e2c82b7a695423d596a38d53e531a7ca4c4263088f2064b6198b42bcfccd98311a64cacfaaf66d269befcd6cb9854887e4a1","href":"https://static.observableusercontent.com/files/5e9a74fdc50e9e55eda946f2f024e2c82b7a695423d596a38d53e531a7ca4c4263088f2064b6198b42bcfccd98311a64cacfaaf66d269befcd6cb9854887e4a1","name":"FY2021P01-P12_All_FA_AccountBreakdownByAward_2022-01-05_H17M06S49_1.csv","type":"text/csv","lastModified":1641408811336.602,"size":33393976},{"id":"3ef46849b55d2535607bb17222ae10b0288a7696f4a113985147561fc5617dea5c04f94746239362710f5c4b3bdbdc7a98b2abc263ac307e9ea1ae6899973960","href":"https://static.observableusercontent.com/files/3ef46849b55d2535607bb17222ae10b0288a7696f4a113985147561fc5617dea5c04f94746239362710f5c4b3bdbdc7a98b2abc263ac307e9ea1ae6899973960","name":"FY2021P01-P12_All_FA_AccountBalances_2022-01-05_H17M11S14_1.csv","type":"text/csv","lastModified":1641434013019.726,"size":717380}] 2e:{"id":"2fc6f74eeaa6de31","slug":"zoomable-circle-packing","title":"Humanitarian Aid Recipients","thumbnail":"26526eaea77b76cb5864af45512b96dbc971ce7f523e81093ebc3132466a3368","access_level":"public","create_time":"$D2022-01-05T16:04:05.288Z","update_time":"$D2022-10-24T20:10:07.127Z","view_time":null,"first_public_time":"$D2022-01-15T03:38:07.260Z","fork":{"id":"5831f55fccfa1c41","slug":"zoomable-circle-packing","title":"Zoomable circle packing","owner":{"id":"863951e3ebe4c0ae","login":"d3","name":"D3"}},"stars":0,"starred":false,"owner":{"type":"team","id":"83499e9a58cbfdf8","login":"marjolein","name":"Marjolein Oostrom","avatar_url":"https://avatars-next.observableusercontent.com/5d583caf7e4d9b8af7462b6fadfb421624df1b34eaff2afa0d301bfc15578c89","tier":"starter_2024"},"version":1346,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"c98da6526bcb1390","login":"marjolein","name":"Marjolein Oostrom","avatar_url":"https://avatars-next.observableusercontent.com/5d583caf7e4d9b8af7462b6fadfb421624df1b34eaff2afa0d301bfc15578c89","tier":null}],"members":[{"type":"individual","id":"c98da6526bcb1390","login":"marjolein","name":"Marjolein Oostrom","avatar_url":"https://avatars-next.observableusercontent.com/5d583caf7e4d9b8af7462b6fadfb421624df1b34eaff2afa0d301bfc15578c89","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Humanitarian Aid Recipients","cells":[{"id":1328,"value":"md`# Humanitarian Aid Recipients`","pinned":true,"hidden":false,"mode":"ojs"},{"id":548,"value":"viewof recipientdrop = select({\n title: \"Recipients\",\n description: \"Select which recipient to highlight\",\n\n options:[first_item].concat(recip_list).map((d) => ({value: d, label:d.substring(0,30)})) ,\n value: \"repo\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":196,"value":"viewof groupByPriority = select({\n title: \"Group by\",\n description: \"Select which key to group by first.\",\n options: [\"Agency->Account\", \"Account->Agency\"],\n value: \"Agency->Account\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":418,"value":"viewof dd3 = Inputs.text({label: \"Enter your tax bill: \", placeholder: \"Enter a tax bill\", value: 10000})","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":1105,"value":"first_item = \"Select One\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":861,"value":"// current_order = {\n// const root = packWithMapChildren(data_total); // B) Final approach //https://observablehq.com/d/ea342ae19603b9a0\n\n// console.log(root)\n// //get ancestor of selected groups\n// var desc = []\n\n// function onlyUnique(value, index, self) {\n// return self.indexOf(value) === index;\n// }\n\n// root.each(function(node) {\n// if (node.data[0] == recipientdrop)\n// {desc.push(node.ancestors().map(d => (d.data[0])))\n// }\n\n// });\n \n// desc = desc.filter(onlyUnique);\n\n// //get first common ancestor\n// var i = 1\n// var min_name = desc.map(d => d[i])\n \n// while (min_name.length > 1 | i == desc[0].length) { \n// min_name = desc.map(d => d[i])\n// min_name = min_name.filter(onlyUnique);\n// i++\n// }\n// var current_order = desc[0].slice(i - 1, desc[0].length -1).reverse().join(' -> ')\n// return current_order}","pinned":true,"hidden":false,"mode":"ojs"},{"id":980,"value":" function onlyUnique(value, index, self) {\n return self.indexOf(value) === index;\n }","pinned":true,"hidden":false,"mode":"ojs"},{"id":1032,"value":" \n function toTitleCase(str) {\n return str.replace(\n /\\w\\S*/g,\n function(txt) {\n return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();\n }\n ).replace(/[.,\\/#!$%\\^&\\*;:{}=\\-_`~()]/g,\"\");\n }","pinned":true,"hidden":false,"mode":"ojs"},{"id":877,"value":"// usaMapCoordinatesDemo = md` ---\n// ## ${current_order}`","pinned":true,"hidden":false,"mode":"ojs"},{"id":1122,"value":"// min_name = {\n// const root = packWithMapChildren(data_total); // B) Final approach //https://observablehq.com/d/ea342ae19603b9a0\n\n// console.log(root)\n// //get ancestor of selected groups\n// var desc = []\n\n\n\n// root.each(function(node) {\n// if (node.data[0] == recipientdrop)\n// {desc.push(node.ancestors().map(d => (d.data[0])))\n// }\n\n// });\n \n// desc = desc.filter(onlyUnique);\n\n// //get first common ancestor\n// var i = 1\n// var min_name = desc.map(d => d[i])\n \n// while (min_name.length > 1 | i == desc[0].length) { \n// min_name = desc.map(d => d[i])\n// min_name = min_name.filter(onlyUnique);\n// i++\n// }\n// return min_name}","pinned":true,"hidden":false,"mode":"ojs"},{"id":909,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":0,"value":"md`# Zoomable Circle Packing\n\nClick to zoom in or out.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":524,"value":"csv_breakdown_awards = FileAttachment(\"FY2021P01-P12_All_FA_AccountBreakdownByAward_2022-01-05_H17M06S49_1.csv\").csv().then(\n function(data) {\n data.forEach(function(d) {\n d.value = d.transaction_obligated_amount,\n d.budget_function = \"International Affairs\" + \": Budget Function\",\n d.owning_agency_name = d.owning_agency_name + \": Agency\",\n d.federal_account_name = d.federal_account_name + \": Account\",\n d.budget_subfunction = d.budget_subfunction + \": Budget Subfunction\",\n d.recipient_name = d.recipient_duns == \"71550813\" ? \"World Food Program\"\n : d.recipient_duns == \"\" ? \"No Recipient Given: Award Funds\"\n : toTitleCase(d.recipient_name)\n });\n return data;\n }\n)","pinned":true,"hidden":false,"mode":"ojs"},{"id":298,"value":"//by federal_account get the sum of the transaction obligated amount spend on awards so can subtract this from total amount per federal account\nsubtract_all_awards = Array.from(\n d3.rollup(\n csv_breakdown_awards,\n D => d3.sum(D, d => d[\"transaction_obligated_amount\"]) , \n d => d.federal_account_symbol,\n)).flatMap(([key, lvalues]) => {\n return {federal_account_symbol: key, transaction_obligated_amount: lvalues};\n });\n","pinned":true,"hidden":false,"mode":"ojs"},{"id":253,"value":"//sum of account balances for all acounts\ncsv_account_balances_unsummed = FileAttachment(\"FY2021P01-P12_All_FA_AccountBalances_2022-01-05_H17M11S14_1.csv\").csv().then(\n function(data) {\n data.forEach(function(d) {\n d.budget_function = d.budget_function + \": Budget Function\",\n d.owning_agency_name = d.owning_agency_name + \": Agency\",\n d.federal_account_name = d.federal_account_name + \": Account\",\n d.budget_subfunction = d.budget_subfunction + \": Budget Subfunction\"\n });\n return data;\n }\n)","pinned":true,"hidden":false,"mode":"ojs"},{"id":390,"value":"//to make sure each row represents a federal account, sum by federal account\n// there are five examples where the federal account is split into two rows because it has two different reporting agencies\ncsv_account_balances = {\n const data = d3.rollup(\n csv_account_balances_unsummed,\n D => d3.sum(D, d => d[\"obligations_incurred\"]), \n d => d.federal_account_symbol,\n)\n const full_data = d3.group(csv_account_balances_unsummed, d => d.federal_account_symbol);\n \n return Array.from(data).flatMap(([key, lvalues]) => {\n return {federal_account_symbol: key, federal_account_name: full_data.get(key)[0].federal_account_name, obligations_incurred: lvalues, owning_agency_name: full_data.get(key)[0].owning_agency_name, budget_subfunction: full_data.get(key)[0].budget_subfunction, budget_function: full_data.get(key)[0].budget_function};\n })\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":325,"value":"$33","pinned":true,"hidden":false,"mode":"ojs"},{"id":278,"value":"//add together so rows are either the federal account total funds (for non international) or funds minus awards (for none international), or rows are awards \ndata_total = csv_breakdown_awards.concat(sum_all_accounts).filter(d => d[\"value\"] > 0)\n\t// .objects() // Uncomment to return an array of objects","pinned":true,"hidden":false,"mode":"ojs"},{"id":968,"value":"\nrecip_list_initial = recipient_account_sum.filter(d => d[\"value\"] > 1000000).map(d => d.recipient_name).sort()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1244,"value":"recip_list = recip_list_initial.filter(function(item) {\n return item !== \"No Recipient Given Award Funds\"\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":193,"value":"//thanks to https://observablehq.com/d/ea342ae19603b9a0\n\nkeysToGroupBy = groupByPriority === \"Agency->Account\" ? [d => d.budget_function, d => d.budget_subfunction, d =>d.owning_agency_name, d=> d.federal_account_name, d => d.recipient_name] : [d => d.budget_function, d => d.budget_subfunction, d=> d.federal_account_name, d =>d.owning_agency_name, d => d.recipient_name];","pinned":true,"hidden":false,"mode":"ojs"},{"id":986,"value":"recipient_account_sum = {\n const data = d3.rollup(\n csv_breakdown_awards,\n D => d3.sum(D, d => d[\"transaction_obligated_amount\"]), \n d => toTitleCase(d.recipient_name),\n)\n return Array.from(data).flatMap(([key, lvalues]) => {\n return {recipient_name: key, value: lvalues};\n })\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":190,"value":"//thanks to https://observablehq.com/d/ea342ae19603b9a0 for data wrangling and grouping option\n\nhierarchyWithMapChildren = d3.hierarchy(d3.rollup(data_total, D => d3.sum(D, d => d[\"value\"]) , ...keysToGroupBy))\n .sum(([, value]) => value)\n .sort((a, b) => b.value - a.value)","pinned":true,"hidden":false,"mode":"ojs"},{"id":212,"value":"packWithMapChildren = data_total => d3.pack()\n .size([width - 2, height - 2])\n .padding(0.2)\n (hierarchyWithMapChildren)","pinned":true,"hidden":false,"mode":"ojs"},{"id":80,"value":"width = 932","pinned":true,"hidden":false,"mode":"ojs"},{"id":1252,"value":"height = width ","pinned":true,"hidden":false,"mode":"ojs"},{"id":198,"value":"import {select} from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":41,"value":"format = d3.format(\",d\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":219,"value":"nameForRootNode = \"Platform\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":45,"value":"color = d3.scaleLinear()\n .domain([0, 5])\n .range([\"hsl(152,80%,80%)\", \"hsl(228,30%,40%)\"])\n .interpolate(d3.interpolateHcl)","pinned":true,"hidden":false,"mode":"ojs"},{"id":6,"value":"d3 = require(\"d3@6\")","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W34","stdlib":"1","titling":"auto"}} 2f:"$2e:body"