21:null 22:["$","title",null,{"children":"United States 2018 Congressional Race FEC Filings Cartogram | Columbia Data Viz Sp20 | Observable"}] 27:T40c,html`

United States 2018 Congressional Race FEC Filings Cartogram

Research shows that the candidate who spends the most usually wins. How true did that phenomenon hold in the 2018 Congressional Race? For example, in the senate race in Texas, Beto O'Rourke had the most total receipts but Ted (Rafael) Cruz, who raised less than half of O'Rourke, won. Other interesting data we hoped to explore was who donated the most to themselves? Which candidate was the most in debt? How did funding trends vary by state? Which party tended to have the most individual contributions? Interact with the visualization below to explore some of these questions.

Select from the dropdown menu to change the dataset, click on a state name to expand that state, or hover over a bar to see details -- see below the title for a text pop-up when hovering.

See below for the write-up and process images.

`28:Tbcd,html `Write Up:

On our first meeting, we unanimously decided that we wanted to do a visualization on the primaries. However, given that the data is too sparse for the ongoing election, we dug around and found interesting data on campaign funding. From there, we worked on cleaning up our dataset and creating our first draft of a static visualization. We initially began with a bar chart, where each bar represented each candidate’s total individual donations. The bar’s color represented the party. After some in-class feedback and research, we decided to move to a small multiples cartogram, displaying the top five donations per state with a bar chart. We split up the work at our second meeting, agreeing on who would do what. We also communicated on Slack, volunteering to do more, asking for help, and overall making sure we were all on the same page. For example, William added the interaction to view different datasets on the cartogram, Ilica worked on the pop-ups, Nicole worked on the click aspect, and Montserrat added a legend. We all conducted user studies (on our parents, partner, brother and roommate).

User studies showed that overall, users wanted to click to expand a state, create easier navigation to the map, have winner data in the pop-up box and have a clear description of colors’ meanings. Some users wanted to see house and senate data separately. We had time to implement some of this feedback. For example, we expanded the states via a click rather than a dropdown menu. We enlarged the ‘return to US map’ button. We also curated data on winners and added it to the pop-up boxes. If we had more time, we would have liked to represent the "winner" graphically as well, to make it more visual and emphasized.

Finally, the largest challenge we encountered was understanding how to use d3 and Observable. We spent a lot of time reading other designers’ code, searching syntaxes on Google, playing around with different implementation ideas, and asking each other for help. Creating mutable variables such that they would be accessed in various functions was also difficult; for example, the ‘var’ type would not work as expected in some scenarios, so we utilized the ‘mutable’ type. Lastly, we worked around various ways to implement the hover interaction as we initially encountered an error where the hover only worked on Google Chrome.

394 words

Helpful Resources:

`29:T11ea,chart = () => { var xScale = d3.scaleBand() .domain(d3.range(11)) .rangeRound([0, 1200]) .padding(0.05); const svg = d3.select(DOM.svg(_width + margin.left + margin.right, height + margin.top + margin.bottom)) const background = svg.append('rect') .attr('width', _width + margin.left + margin.right) .attr('height', height + margin.top + margin.bottom) .attr('fill', bgColor) const g = svg .attr('preserveAspectRatio', 'xMidYMid') .append('g') .attr('transform', `translate(${margin.left + margin.right}, ${margin.top - margin.bottom})`) g.append('text') .attr('text-anchor', 'right') .attr('font-size', 36) .attr('font-family', 'Helvetica') .attr('fill', textColor) .text(getTitle(selectedEncoding)); const states = g.selectAll('.states') .data(cartogram_data) .enter().append('g') .attr('class', 'state-groups'); states.append('g') .attr('transform', d => `translate(${x_column(d)}, ${y_column(d) + state_size})`) .call(xAxis) states.append('g') .attr('transform', d => `translate(${x_column(d)}, ${y_column(d)})`) .selectAll('.bar') .data(d => { return d.data[selectedEncoding+"_"+selectedSenateOrHouse];}).enter() .append('rect') .attr('x', d => x(d.key)) .attr('y', d => z(d.value)) .attr('width', x.bandwidth()) .attr('height', d => z(0) - z(d.value)) .attr('fill', getColor) .attr('stroke', '#fff') .attr('stroke-width', 0.5) //.append('title').text(getText) .on("mouseover", function(d) { console.log(d) var xpos = axisPosition(d.column); var ypos = axisPosition(d.row); console.log(d) // Create the tooltip label as an SVG group with a text and a rect inside var tgrp = svg.append("g") .attr("id", "tooltip") // Uncomment next line if you want the hover to follow the mouse //.attr("transform", (d, i) => `translate(${xpos},${ypos})`); .attr("transform", (d, i) => `translate(${40},${100})`); tgrp.append("rect") .attr("width", "250px") .attr("height", "75px") .attr("fill", bgColor) .attr("stroke", textColor) .style("stroke-dasharray", "6,6") tgrp.append("text") .attr("x", 5) .attr("y", 14) .attr("text-anchor", "left") .attr("font-family", "sans-serif") .attr("font-size", "16px") .attr("font-weight", "bold") .attr("fill", textColor) .text(getText(d).split("\n")[0]) tgrp.append("text") .attr("x", 5) .attr("y", 40) .attr("text-anchor", "left") .attr("font-family", "sans-serif") .attr("font-size", "16px") .attr("font-weight", "bold") .attr("fill", textColor) .text(getText(d).split("\n")[1]) tgrp.append("text") .attr("x", 5) .attr("y", 60) .attr("text-anchor", "left") .attr("font-family", "sans-serif") .attr("font-size", "16px") .attr("font-weight", "bold") .attr("fill", textColor) .text(getText(d).split("\n")[2]) tgrp.append("text") .attr("x", 5) .attr("y", 80) .attr("text-anchor", "left") .attr("font-family", "sans-serif") .attr("font-size", "16px") .attr("font-weight", "bold") .attr("fill", textColor) .text(getText(d).split("\n")[3]); }) .on("mouseout", function(d) { //Remove the tooltip d3.select("#tooltip").remove(); }); states.append('text') .attr('class', 'state-label') .attr('dominant-baseline', 'central') .attr('x', ({column}) => axisPosition(column)) .attr('y', ({row}) => axisPosition(row)) .attr('text-anchor', 'middle') .attr('font-size', 12) .attr('font-family', 'Helvetica') .attr('fill', textColor) .style("cursor", "pointer") .text(d => d.state_postal) .on("click", function(d) { mutable selected_state = d.state_postal; mutable filtered_state = filter_state(mutable selected_state, selectedEncoding); mutable changed = true; }); // Color Legend svg.append("g") .attr("class", "legend legend--ordinal") .attr("transform", "translate(" + (_width - margin.right - margin.left -50) + ", 630)"); svg.select(".legend") .style("fill", textColor) .call(legend); function zoomed() { var transform = d3.event.transform; transform.x = Math.min(0, transform.x); transform.y = 0; } return svg.node() }2a:T9c9,chart2 = (state) => { const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height_state]); const background = svg.append('rect') .attr('width', _width + margin_state.left + margin_state.right) .attr('height', height_state + margin_state.top + margin_state.bottom) .attr('fill', bgColor) svg.append("g") .selectAll("rect") .data(filtered_state.filter(function(d){ console.log("filter rect"); if (selectedSenateOrHouse == "Senate"){ return d.District == 0; } if (selectedSenateOrHouse == "House"){ return d.District > 0; } return d.District>=0; })) .join("rect") .attr("x", (d, i) => x_state(i)) .attr("y", d => { return y_state(d[selectedEncoding]);}) .attr("height", d => y_state(0) - y_state(d[selectedEncoding])) .attr("width", x_state.bandwidth()) .attr("fill", function(d){return getColor_state(d.Party_Code)} ) .append('title').text(d=> getText_state(selectedEncoding,d[selectedEncoding])); svg.append("g") .attr("fill", textColor) .attr("text-anchor", "end") .style("font", "12px sans-serif") .selectAll("text") .data(filtered_state.filter(function(d){ if (selectedSenateOrHouse == "Senate"){ return d.District == 0; } if (selectedSenateOrHouse == "House"){ return d.District > 0; } return d.District>=0; })) .join("text") .attr("y", d => y_state(d[selectedEncoding])) .attr("x", (d, i) => x_state(i) + x_state.bandwidth()/2 - i*5 + 5) .text(d=> "$" + numberWithCommas(d[selectedEncoding])); var filtered_senateHouse = filtered_state.filter(function(d){ if (selectedSenateOrHouse == "Senate"){ return d.District == 0; } if (selectedSenateOrHouse == "House"){ return d.District > 0; } return d.District>=0; }); svg.append("g") .attr("stroke", textColor) .attr("stroke-width", '0.08%') .attr('font-family', 'Helvetica') .attr("transform", `translate(0,${height_state - margin_state.bottom})`) .attr("fill", textColor) .call(d3.axisBottom(x_state).tickFormat(i => { if (i>filtered_senateHouse.length-1) { return ""; } return makeStateLabel(filtered_senateHouse[i].Name,filtered_senateHouse[i].District,filtered_senateHouse[i].State); }).tickSizeOuter(0)) .attr("fill", textColor); svg.append("g") .call(yAxis_state) .attr("fill", textColor); return svg.node(); }2b:T4d9,getText = d => { var candidate = getCandidate(d,selectedEncoding); var district = candidate.district; var state = candidate.state; var winner = ""; if (d.value){ var value = numberWithCommas(d.value); } else{ value = d.value; } if (candidate.name){ var name = reverseName(candidate.name); name = titleCase(name); } else{ name = candidate.name; } if (district == 0){ if (checkSenate(name,state)){ winner = "(W)"; } } else{ if (checkHouse(name,state)){ winner = "(W)"; } } let text switch(selectedEncoding) { case 'Individual_Contributions': { text = `$${(value)} recieved` break } case 'Total_Receipts': { text = `$${(value)} recieved` break } case 'Debts_owed_by': { text = `$${(value)} owed` break } case 'From_Candidate': { text = `$${(value)} contributed` break } default: text = `${value}` break } if (district > 0){ return `Candidate: ${name} \n Race: House Race District ${district} ${winner}\n ${text} in ${d.state} ` } else{ return `Candidate: ${name} \n Race: Senate Race ${winner}\n ${text} in ${d.state} ` } }2c:T59f,maxValues = ({ highest_Individual_Contributions_Both: Math.max.apply(Math, Individual_Contributions_Both.map(function(o) { return o.CAND_1; })), highest_Individual_Contributions_Senate: Math.max.apply(Math, Individual_Contributions_Senate.map(function(o) { return o.CAND_1; })), highest_Individual_Contributions_House: Math.max.apply(Math, Individual_Contributions_House.map(function(o) { return o.CAND_1; })), highest_Total_Receipts_Both: Math.max.apply(Math, Total_Receipts_Both.map(function(o) { return o.CAND_1; })), highest_Total_Receipts_Senate: Math.max.apply(Math, Total_Receipts_Senate.map(function(o) { return o.CAND_1; })), highest_Total_Receipts_House: Math.max.apply(Math, Total_Receipts_House.map(function(o) { return o.CAND_1; })), highest_Debts_owed_by_Both: Math.max.apply(Math, Debts_owed_by_Both.map(function(o) { return o.CAND_1; })), highest_Debts_owed_by_Senate: Math.max.apply(Math, Debts_owed_by_Senate.map(function(o) { return o.CAND_1; })), highest_Debts_owed_by_House: Math.max.apply(Math, Debts_owed_by_House.map(function(o) { return o.CAND_1; })), highest_From_Candidate_Both: Math.max.apply(Math, From_Candidate_Both.map(function(o) { return o.CAND_1; })), highest_From_Candidate_Senate: Math.max.apply(Math, From_Candidate_Senate.map(function(o) { return o.CAND_1; })), highest_From_Candidate_House: Math.max.apply(Math, From_Candidate_House.map(function(o) { return o.CAND_1; })), })2d:Te41,contributions_dict_list = { return Individual_Contributions_Both.map(obj => { const Total_Receipt_Both = Total_Receipts_Both.find(d => d.state === obj.state) const Total_Receipt_Senate = Total_Receipts_Senate.find(d => d.state === obj.state) const Total_Receipt_House = Total_Receipts_House.find(d => d.state === obj.state) const Debt_owed_by_Both = Debts_owed_by_Both.find(d => d.state === obj.state) const Debt_owed_by_Senate = Debts_owed_by_Senate.find(d => d.state === obj.state) const Debt_owed_by_House = Debts_owed_by_House.find(d => d.state === obj.state) const From_Candidates_Both = From_Candidate_Both.find(d => d.state === obj.state) const From_Candidates_Senate = From_Candidate_Senate.find(d => d.state === obj.state) const From_Candidates_House = From_Candidate_House.find(d => d.state === obj.state) const Individual_Contribution_Senate = Individual_Contributions_Senate.find(d => d.state === obj.state) const Individual_Contribution_House = Individual_Contributions_House.find(d => d.state === obj.state) const state_row = statesData.find(d => d.state_postal === obj.state).row const state_column = statesData.find(d => d.state_postal === obj.state).column return { short_state: obj.state, Individual_Contributions_Both: candidates.map(candidate => ({key: candidate, value: obj[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), Total_Receipts_Both: candidates.map(candidate => ({key: candidate, value: Total_Receipt_Both[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), Debts_owed_by_Both: candidates.map(candidate => ({key: candidate, value: Debt_owed_by_Both[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), From_Candidate_Both: candidates.map(candidate => ({key: candidate, value: From_Candidates_Both[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), Individual_Contributions_Senate: candidates.map(candidate => ({key: candidate, value: Individual_Contribution_Senate[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), Total_Receipts_Senate: candidates.map(candidate => ({key: candidate, value: Total_Receipt_Senate[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), Debts_owed_by_Senate: candidates.map(candidate => ({key: candidate, value: Debt_owed_by_Senate[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), From_Candidate_Senate: candidates.map(candidate => ({key: candidate, value: From_Candidates_Senate[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), Individual_Contributions_House: candidates.map(candidate => ({key: candidate, value: Individual_Contribution_House[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), Total_Receipts_House: candidates.map(candidate => ({key: candidate, value: Total_Receipt_House[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), Debts_owed_by_House: candidates.map(candidate => ({key: candidate, value: Debt_owed_by_House[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), From_Candidate_House: candidates.map(candidate => ({key: candidate, value: From_Candidates_House[candidate], state: obj.state, affil : obj.affil, row: state_row, column: state_column})), } }) }2e:T177a,//From https://observablehq.com/d/341771ce931acd22, used to orient states in final visualization statesData = [{ 'state_full': 'Alabama', 'state_postal': 'AL', 'row': 5, 'column': 6 }, { 'state_full': 'Alaska', 'state_postal': 'AK', 'row': 6, 'column': 1 }, { 'state_full': 'Arizona', 'state_postal': 'AZ', 'row': 4, 'column': 1 }, { 'state_full': 'Arkansas', 'state_postal': 'AR', 'row': 4, 'column': 4 }, { 'state_full': 'California', 'state_postal': 'CA', 'row': 3, 'column': 0 }, { 'state_full': 'Colorado', 'state_postal': 'CO', 'row': 3, 'column': 2 }, { 'state_full': 'Connecticut', 'state_postal': 'CT', 'row': 2, 'column': 9 }, { 'state_full': 'District of Columbia', 'state_postal': 'DC', 'row': 4, 'column': 8 }, { 'state_full': 'Delaware', 'state_postal': 'DE', 'row': 3, 'column': 9 }, { 'state_full': 'Florida', 'state_postal': 'FL', 'row': 6, 'column': 8 }, { 'state_full': 'Georgia', 'state_postal': 'GA', 'row': 5, 'column': 7 }, { 'state_full': 'Hawaii', 'state_postal': 'HI', 'row': 6, 'column': 0 }, { 'state_full': 'Idaho', 'state_postal': 'ID', 'row': 1, 'column': 1 }, { 'state_full': 'Illinois', 'state_postal': 'IL', 'row': 1, 'column': 5 }, { 'state_full': 'Indiana', 'state_postal': 'IN', 'row': 2, 'column': 5 }, { 'state_full': 'Iowa', 'state_postal': 'IA', 'row': 2, 'column': 4 }, { 'state_full': 'Kansas', 'state_postal': 'KS', 'row': 4, 'column': 3 }, { 'state_full': 'Kentucky', 'state_postal': 'KY', 'row': 3, 'column': 5 }, { 'state_full': 'Louisiana', 'state_postal': 'LA', 'row': 5, 'column': 4 }, { 'state_full': 'Maine', 'state_postal': 'ME', 'row': -1, 'column': 10 }, { 'state_full': 'Maryland', 'state_postal': 'MD', 'row': 3, 'column': 8 }, { 'state_full': 'Massachusetts', 'state_postal': 'MA', 'row': 1, 'column': 9 }, { 'state_full': 'Michigan', 'state_postal': 'MI', 'row': 1, 'column': 6 }, { 'state_full': 'Minnesota', 'state_postal': 'MN', 'row': 1, 'column': 4 }, { 'state_full': 'Mississippi', 'state_postal': 'MS', 'row': 5, 'column': 5 }, { 'state_full': 'Missouri', 'state_postal': 'MO', 'row': 3, 'column': 4 }, { 'state_full': 'Montana', 'state_postal': 'MT', 'row': 1, 'column': 2 }, { 'state_full': 'Nebraska', 'state_postal': 'NE', 'row': 3, 'column': 3 }, { 'state_full': 'Nevada', 'state_postal': 'NV', 'row': 2, 'column': 1 }, { 'state_full': 'New Hampshire', 'state_postal': 'NH', 'row': 0, 'column': 10 }, { 'state_full': 'New Jersey', 'state_postal': 'NJ', 'row': 2, 'column': 8 }, { 'state_full': 'New Mexico', 'state_postal': 'NM', 'row': 4, 'column': 2 }, { 'state_full': 'New York', 'state_postal': 'NY', 'row': 1, 'column': 8 }, { 'state_full': 'North Carolina', 'state_postal': 'NC', 'row': 4, 'column': 6 }, { 'state_full': 'North Dakota', 'state_postal': 'ND', 'row': 1, 'column': 3 }, { 'state_full': 'Ohio', 'state_postal': 'OH', 'row': 2, 'column': 6 }, { 'state_full': 'Oklahoma', 'state_postal': 'OK', 'row': 5, 'column': 3 }, { 'state_full': 'Oregon', 'state_postal': 'OR', 'row': 2, 'column': 0 }, { 'state_full': 'Pennsylvania', 'state_postal': 'PA', 'row': 2, 'column': 7 }, { 'state_full': 'Rhode Island', 'state_postal': 'RI', 'row': 2, 'column': 10 }, { 'state_full': 'South Carolina', 'state_postal': 'SC', 'row': 4, 'column': 7 }, { 'state_full': 'South Dakota', 'state_postal': 'SD', 'row': 2, 'column': 3 }, { 'state_full': 'Tennessee', 'state_postal': 'TN', 'row': 4, 'column': 5 }, { 'state_full': 'Texas', 'state_postal': 'TX', 'row': 6, 'column': 3 }, { 'state_full': 'Utah', 'state_postal': 'UT', 'row': 3, 'column': 1 }, { 'state_full': 'Vermont', 'state_postal': 'VT', 'row': 0, 'column': 9 }, { 'state_full': 'Virginia', 'state_postal': 'VA', 'row': 3, 'column': 7 }, { 'state_full': 'Washington', 'state_postal': 'WA', 'row': 1, 'column': 0 }, { 'state_full': 'West Virginia', 'state_postal': 'WV', 'row': 3, 'column': 6 }, { 'state_full': 'Wisconsin', 'state_postal': 'WI', 'row': 0, 'column': 5 }, { 'state_full': 'Wyoming', 'state_postal': 'WY', 'row': 2, 'column': 2 } ]2f:[{"id":"8f0fe0a4686d6311dc311b52e8fba8deba5f889fccb92926ec467c00f5ef1089de4e7dbd2cf412f4f748ea92627498992acb12f4d93b30df05adb5dbb2e6f4b9","href":"https://static.observableusercontent.com/files/8f0fe0a4686d6311dc311b52e8fba8deba5f889fccb92926ec467c00f5ef1089de4e7dbd2cf412f4f748ea92627498992acb12f4d93b30df05adb5dbb2e6f4b9","name":"second run.png","type":"image/png","lastModified":1585083004866.462,"size":109756},{"id":"27f761a85aa067a15f96a8daa548ff1ddad990281af41bfeffd009286de524ddd7c8facdd4990b79f119850ad0d83d860feeceee292d5ac2029cfe24a94e5f4e","href":"https://static.observableusercontent.com/files/27f761a85aa067a15f96a8daa548ff1ddad990281af41bfeffd009286de524ddd7c8facdd4990b79f119850ad0d83d860feeceee292d5ac2029cfe24a94e5f4e","name":"third run.png","type":"image/png","lastModified":1585083005990.875,"size":138252},{"id":"2f3eac9e216b1c0f38f7d1675398b254979c8467842e7c7eea47e97155213c89de23a2b82a43516d878668d10b9276cb0c74ef2ba38f78644b94c90d068c44f6","href":"https://static.observableusercontent.com/files/2f3eac9e216b1c0f38f7d1675398b254979c8467842e7c7eea47e97155213c89de23a2b82a43516d878668d10b9276cb0c74ef2ba38f78644b94c90d068c44f6","name":"first run.png","type":"image/png","lastModified":1585083006051.806,"size":193519},{"id":"a089a800f6502f4023446970a76057f3024f33c76d80ca6ef5b39d4b876466f5b8a960bbf4ed214d9755185eb39666d0ea97ae84f94955901964ca78e27664ae","href":"https://static.observableusercontent.com/files/a089a800f6502f4023446970a76057f3024f33c76d80ca6ef5b39d4b876466f5b8a960bbf4ed214d9755185eb39666d0ea97ae84f94955901964ca78e27664ae","name":"second run 2.png","type":"image/png","lastModified":1585083403418.758,"size":123318},{"id":"a089a800f6502f4023446970a76057f3024f33c76d80ca6ef5b39d4b876466f5b8a960bbf4ed214d9755185eb39666d0ea97ae84f94955901964ca78e27664ae","href":"https://static.observableusercontent.com/files/a089a800f6502f4023446970a76057f3024f33c76d80ca6ef5b39d4b876466f5b8a960bbf4ed214d9755185eb39666d0ea97ae84f94955901964ca78e27664ae","name":"second run 2@1.png","type":"image/png","lastModified":1585083566023.302,"size":123318},{"id":"2f3eac9e216b1c0f38f7d1675398b254979c8467842e7c7eea47e97155213c89de23a2b82a43516d878668d10b9276cb0c74ef2ba38f78644b94c90d068c44f6","href":"https://static.observableusercontent.com/files/2f3eac9e216b1c0f38f7d1675398b254979c8467842e7c7eea47e97155213c89de23a2b82a43516d878668d10b9276cb0c74ef2ba38f78644b94c90d068c44f6","name":"first run@1.png","type":"image/png","lastModified":1585083581495.622,"size":193519},{"id":"27f761a85aa067a15f96a8daa548ff1ddad990281af41bfeffd009286de524ddd7c8facdd4990b79f119850ad0d83d860feeceee292d5ac2029cfe24a94e5f4e","href":"https://static.observableusercontent.com/files/27f761a85aa067a15f96a8daa548ff1ddad990281af41bfeffd009286de524ddd7c8facdd4990b79f119850ad0d83d860feeceee292d5ac2029cfe24a94e5f4e","name":"third run@1.png","type":"image/png","lastModified":1585083592157.136,"size":138252}] 25:{"id":"67967d479a5c7378","slug":"united-states-2018-congressional-race-fec-filings-cartogr","title":" United States 2018 Congressional Race FEC Filings Cartogram ","thumbnail":"a3eeb7952c7d9e5bbc3d1823152904d34eb0a8b9f069ee739d4b15be64f39322","access_level":"public","create_time":"$D2020-03-19T05:42:06.523Z","update_time":"$D2020-03-31T02:49:08.176Z","view_time":null,"first_public_time":"$D2020-03-31T23:56:04.026Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"f2afce386e220571","login":"columbiaviz","name":"Columbia Data Viz Sp20","avatar_url":"https://avatars-next.observableusercontent.com/75cfb0d1feb629c550edba49bbd42f5b27309d10091787cff17d4ee734d2c4e8","tier":"education_2026","bio":"Columbia University Data Visualization, Computer Science Dept."},"version":2757,"publish_version":2757,"role":null,"authored":false,"authors":[{"type":"individual","id":"f2124e31d91ce9df","login":"whall800","name":"","avatar_url":"https://avatars-next.observableusercontent.com/51199734d1fd87abcdd8d5f4ebdfc91d5e11a8ea632257159daf648454809416","tier":null,"bio":""}],"members":[{"type":"team","id":"f2afce386e220571","login":"columbiaviz","name":"Columbia Data Viz Sp20","avatar_url":"https://avatars-next.observableusercontent.com/75cfb0d1feb629c550edba49bbd42f5b27309d10091787cff17d4ee734d2c4e8","tier":"education_2026","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":null,"type":"notebook","body":{"titling":"auto","title":" United States 2018 Congressional Race FEC Filings Cartogram ","cells":[{"id":1,"value":"$27","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1626,"value":"display = display_image();\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2685,"value":"html `

Note: (W) stands for Winner of that state's respective race

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2167,"value":"viewof home = {\n const button = html`