2e:null 2f:["$","title",null,{"children":"How climate change affects the migration trend from Central America to the US | Yonghak Kim | Observable"}] 34:T71d,htl.html` `35:T70e,graph = { const svg = d3.select(DOM.svg(width, height3)); let link = svg .append("g") .attr("class", "links") .attr("fill", "none") .attr("stroke", "#F38366") .attr("stroke-opacity", 1); let node = svg .append("g") .attr("class", "nodes") .attr("font-family", "sans-serif") .attr("font-size", 14) .selectAll("g"); link = link .selectAll(".curves") .data(sankeyData.links) .enter() .append("path") .attr("d", d3Sankey.sankeyLinkHorizontal()) .attr("opacity", 1) //.attr("stroke-width", (d) => Math.max(1, d.width)) .attr("stroke-width", (d) => d.width) .attr("stroke", (d) => { if (d.source.name.includes("El")){ return colors["El Salvador"] } else{ return colors[d.source.name.split(" ")[0]] } }) .attr("class", (d) => d.source.name); link.append("title").text((d) => `${d.source.name} → ${d.target.name}`); node = node.data(sankeyData.nodes).enter().append("g"); node .append("rect") .attr("x", (d) => d.x0) .attr("y", (d) => d.y0) .attr("height", (d) => d.y1 - d.y0) .attr("width", (d) => d.x1 - d.x0) .attr("fill", "#393A3B") .on("mouseover", (e, d) => svg.selectAll("." + d.name).classed("animated", true) ) .on("mouseout", (e, d) => svg.selectAll("." + d.name).classed("animated", false) ); node .append("text") .attr("x", (d) => d.x0 - 6) .attr("y", (d) => (d.y1 + d.y0) / 2) .attr("fill", "#393A3B") .attr("dy", "0.1em") .attr("text-anchor", "end") .text((d) => d.name) .filter((d) => d.x0 < width / 2) .attr("x", (d) => d.x1 + 6) .attr("text-anchor", "start"); node.append("title").text((d) => `${d.name}`); return svg.node(); }36:T506,mChart = { // const height = 500; const svg = d3.create("svg").attr("width", widthBar).attr("height", height); svg .append("rect") .attr("x", 0) .attr("y", 0) .attr("width", widthBar) .attr("height", height) .attr("fill", "#f2f2f2f2"); // const svg = d3.select(DOM.svg(width, height)) // .style("-webkit-tap-highlight-color", "transparent") // .style("overflow", "visible"); svg.append("g") .call(xAxis); svg.append("g") .call(yAxis); svg.append("path") .datum(bool_func) .attr("fill", "none") .attr("stroke", "#dd322a") .attr("stroke-width", 3) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line) .call(transition); // const tooltip = svg.append("g"); // svg.on("touchmove mousemove", function() { // const {date, value} = bisect(d3.mouse(this)[0]); // tooltip // .attr("transform", `translate(${x(date)},${y(value)})`) // .call(callout, `${value.toLocaleString(undefined, {style: "currency", currency: "USD"})} // ${date.toLocaleString(undefined, {month: "short", day: "numeric", year: "numeric"})}`); // }); // svg.on("touchend mouseleave", () => tooltip.call(callout, null)); return svg.node(); }37:Ta5d,{playAgain; //svg area const svg = d3.create("svg").attr("width", width).attr("height", height2); svg .append("rect") .attr("width", width) .attr("height", height2) .attr("fill", "#f2f2f2f2")//.attr('id',...); //rotated group to hold countries const g = svg.append("g"); // .attr("transform", "rotate(-90," + width / 2 + "," + height / 2 + ")"); //the function that takes geographic data and converts to SVG paths const path = d3.geoPath().projection(projection); //draw countries(Central America) g.selectAll(".countries") .data(northAmerica.features) .enter() .append("path") .attr("d", path) .attr("stroke", "#DD3429") // (d) => // supportedSources.includes(d.properties.name) ? "white" : "#DD3429" // ) .attr("fill", (d) => selectedSources.includes(d.properties.name) ? fakeScale(d.properties.name) : "#f2f2f2f2" ) .attr("stroke-width", 0.25); //draw countries(The US) g.selectAll(".states") .data(statesWithMigrationData.features) .enter() .append("path") .attr("d", path) .attr("stroke", "#DD3429") .attr("stroke-width", 0.25) .attr("fill", "#DCDDDE") // .attr("fill-opacity", 0.15) ; g.selectAll('.popDots') .data(statesWithMigrationData.features) .enter() .append('circle') .attr('cx',d=>projection(d.centroid)[0]) .attr('cy', d=> projection(d.centroid)[1]) .attr('r',0) .attr('class','popDots') .attr('fill','#DD3429') .attr('opacity', 0.3) .transition() .duration(d=>growScale(totalMigration[d.properties.NAME])) .attr('r',d=>circleScale(totalMigration[d.properties.NAME])) //walk through states for (let state of statesWithMigrationData.features) { const stateArcs = state.trails .filter((d) => selectedSources.includes(d.properties.source)) .filter((d) => d.properties.migration); //draw arcs g.selectAll(".arcs") .data(stateArcs) .enter() .append("path") .attr("d", (d) => path(d)) .attr("fill", "none") .attr("stroke-width", 1) .attr("stroke", (d) => selectedSources.includes(d.properties.name) ? fakeScale(d.properties.name) : "#DD3429" ) // (d) => // d3.interpolatePlasma(sourceScale(d.properties.source)) // ) .style("stroke-dasharray", "3 6") .style("stroke-dashoffset", (d) => Math.random() * 100) .style( "animation", (d) => "dash " + durationScale(parseInt(d.properties.migration[selectedPeriod])) + "s linear infinite" ); } return svg.node(); }38:T4ad,tooltip = { chart1; const tooltip = d3 .select("body") .append("div") .attr("class", "svg-tooltip") .style("position", "absolute") .style("visibility", "hidden") .style('pointer-events','none'); // select all rect d3.selectAll("rect") .on("mouseover", function(event, d) { // change the selection style d3.select(this) .raise() .attr('stroke-width', '2') .attr("stroke", "black"); // make the tooltip visible and update its text tooltip .style("visibility", "visible") .text(`Date: ${d.date}\nDisaster: ${d.disaster}\n${d.eventName}\nCountry: ${d.country}`); // ${d.x0}\nx1: ${d.x1}`); }) .on("mousemove", function(event, d) { tooltip .style("top", event.pageY - 10 + "px") .style("left", event.pageX < width/2? event.pageX + 10 + "px" : event.pageX - 150 + "px"); }) .on("mouseout", function() { // change the selection style d3.select(this).lower().attr('stroke-width', '0'); tooltip.style("visibility", "hidden"); }) .on("click", function() { d3.select(this) .attr("xlink:href", "http://en.wikipedia.org/wiki/") }); }39:[{"id":"59579fd9fd76a6ea38a9b7b9419d682d0eea3d4be292fc4eb009a89a64c8c3a25f3868d61b1344e3dad3045131dfd3a57aa55a5802276dbd0cb3cab506e2d450","href":"https://static.observableusercontent.com/files/59579fd9fd76a6ea38a9b7b9419d682d0eea3d4be292fc4eb009a89a64c8c3a25f3868d61b1344e3dad3045131dfd3a57aa55a5802276dbd0cb3cab506e2d450","name":"climate-migration1.png","type":"image/png","lastModified":1639347696158.514,"size":9662994},{"id":"a9829b757eb9694935138f819a7bccedcf5598f57b668180a58a5a3ce67c13c78981236f80b2c02e66af96187d801daa1793f5af36a4f726ac1fa93cac45068a","href":"https://static.observableusercontent.com/files/a9829b757eb9694935138f819a7bccedcf5598f57b668180a58a5a3ce67c13c78981236f80b2c02e66af96187d801daa1793f5af36a4f726ac1fa93cac45068a","name":"Guatemala.csv","type":"text/csv","lastModified":1639347688401.341,"size":3706},{"id":"c4c1a7cbceed7075e84d0528f6d0435da96e6bbbd0b5c72fb9a7133b1a0d483323a4f5a8e4e50fec1005f886ab92117a47c57cbd04543cd40f94fae6a77a187a","href":"https://static.observableusercontent.com/files/c4c1a7cbceed7075e84d0528f6d0435da96e6bbbd0b5c72fb9a7133b1a0d483323a4f5a8e4e50fec1005f886ab92117a47c57cbd04543cd40f94fae6a77a187a","name":"El Salvador.csv","type":"text/csv","lastModified":1639347688384.326,"size":3806},{"id":"b994c16ab417f035aef5244a5f7cba7924b646986ad3725776cca955968d5cf987ac9fcf796d6410d33c4a4365d6ce57426c4942d0588185674bb21c003113bb","href":"https://static.observableusercontent.com/files/b994c16ab417f035aef5244a5f7cba7924b646986ad3725776cca955968d5cf987ac9fcf796d6410d33c4a4365d6ce57426c4942d0588185674bb21c003113bb","name":"untitled-10-1.json","type":"application/json","lastModified":1639347688382.388,"size":1858},{"id":"e86f16c705bc2e9d86a82a6ce31239990749f7c6198d4427d8e12c64761557f82a2df01bf5b20f7e8623633296ad6e6f8f6dc412ed4c9330da2405e4925eadee","href":"https://static.observableusercontent.com/files/e86f16c705bc2e9d86a82a6ce31239990749f7c6198d4427d8e12c64761557f82a2df01bf5b20f7e8623633296ad6e6f8f6dc412ed4c9330da2405e4925eadee","name":"custom.geo-3.json","type":"application/json","lastModified":1639347689062.922,"size":130433},{"id":"e99211bddb52388d10c5f493c3870e06617d07625aa251e23a687cf24ed3980de1222966fc6c433068056f136a43738893ff65983e4dfc2ce2404bff829840be","href":"https://static.observableusercontent.com/files/e99211bddb52388d10c5f493c3870e06617d07625aa251e23a687cf24ed3980de1222966fc6c433068056f136a43738893ff65983e4dfc2ce2404bff829840be","name":"climate-refugee.jpeg","type":"image/jpeg","lastModified":1639347688848.297,"size":130800},{"id":"59b25b806cd9ec39877d0db2fd96e89a5defd2232e358c57444e1104e377b444df8ea7ead45ad4c9b5d0d07d8648eca06b7a56d8569e2a99ff593d56794abcea","href":"https://static.observableusercontent.com/files/59b25b806cd9ec39877d0db2fd96e89a5defd2232e358c57444e1104e377b444df8ea7ead45ad4c9b5d0d07d8648eca06b7a56d8569e2a99ff593d56794abcea","name":"Mexico.csv","type":"text/csv","lastModified":1639347688416.427,"size":4835},{"id":"1fbdd5dc7ab19695cd2af7a8b5944e21fb168986bb5cffa17e77f37f6387dd8b2a5e892838d909be759eef06427c54e6e5935b8051c3087494d39d6f899ed1c0","href":"https://static.observableusercontent.com/files/1fbdd5dc7ab19695cd2af7a8b5944e21fb168986bb5cffa17e77f37f6387dd8b2a5e892838d909be759eef06427c54e6e5935b8051c3087494d39d6f899ed1c0","name":"gz_2010_us_040_00_5m.json","type":"application/json","lastModified":1639347692834.967,"size":2552566},{"id":"caefea358c2a14270eb386f421e15c1376aac689844d41bcc3c732de8d70aeb54e389079ceef26f758d9727b86344efa7dae978d26699c147097742dfcee3387","href":"https://static.observableusercontent.com/files/caefea358c2a14270eb386f421e15c1376aac689844d41bcc3c732de8d70aeb54e389079ceef26f758d9727b86344efa7dae978d26699c147097742dfcee3387","name":"Disaster5.csv","type":"text/csv","lastModified":1639347688524.145,"size":36639},{"id":"bca5ab62242a1094461becd3c6910106b9bc15cbe109f28b49082b4df909931402fbcc5751d8e711b408ea3c7e2925879c33d9b6caa43c1b25edae5fef81cf71","href":"https://static.observableusercontent.com/files/bca5ab62242a1094461becd3c6910106b9bc15cbe109f28b49082b4df909931402fbcc5751d8e711b408ea3c7e2925879c33d9b6caa43c1b25edae5fef81cf71","name":"7-23-20-Border Patrol Ramps Up Patrols in Otay Mountain Wilderness Photo 1.jpeg","type":"image/jpeg","lastModified":1639347688451.475,"size":89671},{"id":"9bbf6cf3159da91e84d9bee9d92ea63753e32adb67dd75f37645a95787e6f45a61541c4dd47fa9efa8e31633113da6af3d462b61bb042cbd95e7f6f60f9f0cfd","href":"https://static.observableusercontent.com/files/9bbf6cf3159da91e84d9bee9d92ea63753e32adb67dd75f37645a95787e6f45a61541c4dd47fa9efa8e31633113da6af3d462b61bb042cbd95e7f6f60f9f0cfd","name":"Migration Total-2.csv","type":"text/csv","lastModified":1639347688426.756,"size":105},{"id":"b17226dd702ec4e650f872147d7417fa1355500bd3ba6083eb76bb64f0a1d94e5d0d7c288c44867c5773708e7034a92c933007189665c2bef8d976301f488103","href":"https://static.observableusercontent.com/files/b17226dd702ec4e650f872147d7417fa1355500bd3ba6083eb76bb64f0a1d94e5d0d7c288c44867c5773708e7034a92c933007189665c2bef8d976301f488103","name":"Chart 2-5.svg","type":"image/svg+xml","lastModified":1639347689828.761,"size":256247},{"id":"0cfdd4b2e4bf2898a52a32e035fcc3ad3b5e0a249c6417dd0d7227a719f122b37d6d0c4fa1112e510b81e7f1add405dcb28a7ac068dafaf6f6b608a6b3dd559d","href":"https://static.observableusercontent.com/files/0cfdd4b2e4bf2898a52a32e035fcc3ad3b5e0a249c6417dd0d7227a719f122b37d6d0c4fa1112e510b81e7f1add405dcb28a7ac068dafaf6f6b608a6b3dd559d","name":"Climate Total-2.csv","type":"text/csv","lastModified":1639347688347.121,"size":72}] 32:{"id":"b02df7bb082e1f84","slug":"how-climate-change-affects-the-migration-trend-from-centra","title":"How climate change affects the migration trend from Central America to the US","thumbnail":"1b8e897558e3c3d5516afc0b2c3b8cc3bf5d45a6697e319b4d5f6bc18cbc3750","access_level":"public","create_time":"$D2021-12-12T22:18:48.984Z","update_time":"$D2021-12-12T22:45:34.951Z","view_time":null,"first_public_time":"$D2021-12-12T22:44:20.348Z","fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"a3c3de8ace492cbf","login":"designyk","name":"Yonghak Kim","avatar_url":"https://avatars-next.observableusercontent.com/bf36b9b9ddc35ea4d3ff4026fea71353b6448d7b0950e73e44241a48dfe70696","tier":"starter_2024"},"version":395,"publish_version":395,"role":null,"authored":false,"authors":[{"type":"individual","id":"512d6c5dbbb0f9da","login":"designyk","name":"Yonghak Kim","avatar_url":"https://avatars-next.observableusercontent.com/bf36b9b9ddc35ea4d3ff4026fea71353b6448d7b0950e73e44241a48dfe70696","tier":null}],"members":[{"type":"individual","id":"512d6c5dbbb0f9da","login":"designyk","name":"Yonghak Kim","avatar_url":"https://avatars-next.observableusercontent.com/bf36b9b9ddc35ea4d3ff4026fea71353b6448d7b0950e73e44241a48dfe70696","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"How climate change affects the migration trend from Central America to the US","cells":[{"id":0,"value":"# How climate change affects the migration trend from Central America to the US\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"md`Migration between countries has continuously increased, and the factors are also diverse. However, when looking at the survey results on immigration factors between 2010 and 2015, the proportion of people citing their reason for migration was due to climate change is increasing significantly. So then, why are these environmental factors suddenly getting more attention than ever? And would this trend continue in the future?\n\nWe would like to analyze this phenomenon from a macro perspective based on long-term data over the past 70 years to answer this question. `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"FileAttachment(\"climate-migration1.png\").image()\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"md`\n[Source](https://www.refugeesinternational.org/reports/2021/7/12/task-force-report-to-the-president-on-the-climate-crisis-and-global-migration-a-pathway-to-protection-for-people-on-the-move)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"md`[*Source*](https://www.wfpusa.org/emergencies/dry-corridor/)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"md`-----`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"md`\n## Natural disasters in Mexico, Guatemala, and El Salvador\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"viewof countryFilter = radio({\n title: \"Country\",\n options: [\n { label: \"All\", value: \"All\" },\n { label: \"Mexico\", value: \"Mexico\" },\n { label: \"Guatemala\", value: \"Guatemala\" },\n { label: \"ElSalvador\", value: \"ElSalvador\" },\n ],\n value: \"All\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"Swatches(d3.scaleOrdinal(['Flood','Drought','Storm','Wildfire','Extreme temperature'], (['#DD3429','#F38366','#E6E7E8', '#818185', '#393A3B'])));","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"chart1 = {\n const svg = d3.create(\"svg\")\n .attr(\"viewBox\", [0, 0, width, height1]);\n\n \n for(const decade of decades){\n\n svg.append(\"g\")\n // .attr(\"fill\", '#DD322A')\n .selectAll(\"rect\")\n .data(decade.events)\n .enter()\n .append('a')\n //.attr('xlink:href',d=>d.link)\n // .attr('target',\"_blank\")\n .append(\"rect\")\n .attr(\"x\",(d, i) => decadeScale(decade.decade) + (i * (decadeScale.bandwidth()/decade.count)))\n .attr(\"y\", 10)\n .attr(\"height\", height1-40)\n .attr(\"width\", (decadeScale.bandwidth()/decade.count))\n .attr(\"fill\", (d,i)=> colorScale(d.disaster));\n }\n svg.append(\"g\")\n .call(xAxis1);\n \n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"md`\n[Source](https://public.emdat.be/data)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"md`Since the 1950s, Natural Disaster has been increased continuously in Central America. This increase ought to climate change caused by global warming. On the other hand, if you look at the migration trends from these countries to the United States, you will see that the trends are generally consistent as the lines go far denser over time.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":33,"value":"md`-----`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"md`\n## Migration from Mexico, Guatemala, and El Salvador to the US\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":37,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"md`\nThe width of each line means the number of migrants to the US per decade, and we can see the lines are getting thicker over time since the 1950s. However, there is an inconsistency as well, which means the changes in the number of natural disasters in Central America do not necessarily reflect the changes in migration rate to the US anytime.\n\nWe visualized it as a line chart to better understand how it has changed over time and see the overall trend.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"md`-----`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":45,"value":"md`## Overall trend of Migration & Disaster`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"viewof widthBar = slider({\n min: 0,\n max: 1200,\n step: 50,\n value: 1200,\n title: \"Graph Width\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":51,"value":"viewof dataSelector = radio( {\n // title: 'Select the data to be plotted',\n options: [\n { label: 'Migration', value: 'mData' },\n { label: 'Disaster', value: 'cData' },\n ],\n value: 'mData'\n} );","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":57,"value":"md`Given the data above, the overall trends of increasing migration rates and frequency of natural disasters seem consistent. However, there has been a significant difference since the 1970s as well. If so, what are the factors that caused this?`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"md`-----`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"md`## Other Factors of Migration Change`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"md`\n### *Economic Conditions in Central America*`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"md`Since the 1970s, the GDP growth rate of Central America including Mexico is in inverse proportion to the change trend of the migration rate. This is the basis for inferring that internal economic decline accelerated migration to the United States. In addition, social factors such as Demographic Changes and Declining Fertility acted simultaneously, and this increase has turned to a sharp decline since the 1990s. [*Source*](https://data.worldbank.org/indicator/NY.GDP.MKTP.KD.ZG?locations=MX-GT-SV)\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"md`### *Immigration Law Enforcement in the US*`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":71,"value":"FileAttachment(\"7-23-20-Border Patrol Ramps Up Patrols in Otay Mountain Wilderness Photo 1.jpeg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":73,"value":"md`Meanwhile, the direct cause of the sharp decline in migration since the 1990s can be attributed to the US government's strengthening of border area control. Since 1992, the US government has increased the number of border patrols by a factor of nine, and this measure has caused a sharp decline in the number of migrants crossing the border. [*Source*](https://en.wikipedia.org/wiki/U.S._Immigration_and_Customs_Enforcement)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":75,"value":"FileAttachment(\"Chart 2-5.svg\").image()\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"md`In the chart above, we can see the socio-economic factors such as declined GDP growth in Central America since the 1960s and the border security enhancement by the US government in the 1990s affected the migration rate to the US at a decade interval. However, given the overall increasing trend, those are temporary, which means the consistent movement of natural disasters in Central America is the more dominant factor in the growing migration trend to the US..`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"md`-----`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"md`## Where these people have been heading for in the US?`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":89,"value":"md`\n### Filtering and Viz Controls`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":91,"value":"//Create some buttons for each source country\nviewof selectedSources = Inputs.checkbox(supportedSources, {\n value: [\"El Salvador\", \"Mexico\", \"Guatemala\"]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"//Create some buttons for each column from CSV file\nviewof selectedPeriod = Inputs.radio(supportedYears, { value: \"2010\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"viewof sourceCountryColor = Inputs.color({\n label: \"Source Country Color\",\n value: \"#008cb4\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":101,"value":"viewof animated = Inputs.toggle({\n label: \"Check this to Animate!\",\n value: false\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"viewof playAgain = Inputs.button(\"Play!\",{\n label: \"Click to Replay!\",\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"playAgain","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":108,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"md`The migration rates to each state in the US vary, and the difference depends on diverse factors like the number of jobs. This map shows the number of total migrants from Central America to each state in the US. The speed of movement of each dashed line stands for the number of migrants by decade. And the size of the circles means the accumulation of the total number of migrants to each state. (It only shows the information of top ten destination states in the US)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":114,"value":"md`-----`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":116,"value":"md`## Projections of Future Migration`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":118,"value":"FileAttachment(\"climate-refugee.jpeg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":120,"value":"md`\n[Source](https://www.refugeesinternational.org/reports/2020/5/7/climate-migration-and-displacement-what-are-the-implications-for-human-rights-law)\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":122,"value":"md`Even considering the other factors like socio-economic conditions in Central America and the US, the overall migration rate is still increasing, which is affected by continuous environmental factors. And if you look at the recent increase in the extension of this trend, it seems that the environmental factors which have not appeared recently happened are highlighted again. In other words, potential factors accumulated over time affect people's perceptions combined with the recent rapid increase in environmental changes..\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":124,"value":"md`-----`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":128,"value":"md`### Appendix`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":130,"value":"md`#### general`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":132,"value":"d3 = require(\"d3@7\", \"d3-sankey@0.12\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":136,"value":"import {legend, Swatches} from \"@d3/color-legend\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":138,"value":"import { slider, checkbox } from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":142,"value":"import { radio, select } from '@jashkenas/inputs';","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":144,"value":"height = 400","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":146,"value":"margin = ({top:20, right:30, bottom:30, left:40})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":148,"value":"md`#### barchart`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":150,"value":"rawData = FileAttachment(\"Disaster5.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":154,"value":"refineData = rawData.map((disasterData) => ({\n scope: disasterData.Scope,\n year: disasterData.Year,\n date: disasterData.Year+\"-\"+disasterData.Month+\"-\"+disasterData.Day,\n disaster: disasterData.Disaster,\n eventName: disasterData.EventName,\n country: disasterData.Country,\n region: disasterData.Region\n}))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":156,"value":"scope = groupBy(\n refineData.filter((d) => d.year),\n \"scope\"\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":158,"value":"groupBy = (items, key) =>\n items.reduce(\n (result, item) => ({\n ...result,\n [item[key]]: [...(result[item[key]] || []), item]\n }),\n {}\n )","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":160,"value":"flatDates = Object.values(scope)\n .map((scope) => scope.map((dateWhole) => dateWhole.date))\n //remove by city sorting\n .flat()\n //remove undefined\n .filter((d) => d)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":162,"value":"flatYears = Object.values(scope)\n .map((scope) => scope.map((dateYear) => dateYear.year))\n //remove by city sorting\n .flat()\n //remove undefined\n .filter((d) => d)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":164,"value":"decades = Object.entries(scope).map(d=>({decade:parseInt(d[0]),events:d[1], count:d[1].length}))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":166,"value":"colorScale = d3.scaleOrdinal().domain(['Flood','Drought','Storm','Wildfire','Extreme temperature']).range(['#DD3429','#F38366','#E6E7E8', '#818185', '#393A3B'])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":168,"value":"decadeScale = d3.scaleBand().domain(decades.map(d=>d.decade)).range([margin.left,width-margin.right])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":170,"value":"decadeScale.bandwidth()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":172,"value":"JSON.stringify(refineData)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":174,"value":"x1 = d3.scaleBand()\n .domain(d3.range(refineData.length))\n .range([margin1.left, width - margin1.right])\n .padding(0)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":176,"value":"margin1 = ({top: 30, right: 0, bottom: 30, left: 40})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":178,"value":"height1 = 500","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":180,"value":"xScale = d3\n .scaleTime()\n .domain(d3.extent(flatYears))\n .range([margin1.left , width - margin1.right])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":182,"value":"xAxis1 = (g) =>\n g\n .attr(\"transform\", `translate(0,${height1 -30})`)\n .call(d3.axisBottom(xScale))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":184,"value":"styles = html`\n `","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":186,"value":"$38","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":190,"value":"md`#### Sankey Chart`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":194,"value":"d3Sankey = require(\"d3-sankey\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":196,"value":"importData = FileAttachment(\"untitled-10-1.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":198,"value":"//Read about styling options available at https://github.com/d3/d3-sankey\nsankey = d3Sankey\n .sankey()\n .nodeWidth(30)\n .nodePadding(10)\n .linkSort(d3.ascending)\n .extent([\n [horizontalMargin, verticalMargin],\n [width - horizontalMargin, height3 - verticalMargin]\n ])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"nodes = importData\n .map((d) => ({ name: d.Hometown + \" \" + d.year }))\n .concat([{ name: \"United States\" }])\n .sort((a, b) =>\n d3.descending(a.Hometown + \" \" + a.year, b.Hometown + \" \" + b.year)\n )","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":202,"value":"links = importData.map((d) => ({\n source: d.Hometown + \" \" + d.year,\n target: \"United States\",\n value: d.value\n}))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":204,"value":"sankeyData = {\n const sD = {\n nodes: nodes,\n links: links\n };\n\n sD.links.map((link) => {\n link.source = sD.nodes.findIndex((node) => node.name == link.source);\n link.target = sD.nodes.findIndex((node) => node.name == link.target);\n });\n\n return sankey(sD);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":206,"value":"height3 = 600","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":208,"value":"horizontalMargin = 30","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":210,"value":"verticalMargin = 10","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":212,"value":"colors= ({Mexico:\"#DD3429\", Guatemala:\"#F38366\", \"El Salvador\":\"#E6E7E8\"})\n\n// Swatches(d3.scaleOrdinal(['Flood','Drought','Storm','Wildfire','Extreme temperature'], (['#DD3429','#F38366','#E6E7E8', '#818185', '#393A3B'])));","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":214,"value":"md`#### line chart`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":216,"value":"mData = d3.csvParse(await FileAttachment(\"Migration Total-2.csv\").text(), d3.autoType)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":218,"value":"cData = d3.csvParse(await FileAttachment(\"Climate Total-2.csv\").text(), d3.autoType)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":220,"value":"bool_func= { var v \nif(dataSelector == 'mData')\n {return mData}\n else{} return cData }","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":222,"value":"x = d3.scaleTime()\n .domain(d3.extent(bool_func, d => d.Year))\n .range([margin.left, width - margin.right])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":224,"value":"y = d3.scaleLinear()\n .domain([0, d3.max(bool_func, d=> d.Total)])//.nice()\n .range([height - margin.bottom, margin.top])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":226,"value":"xAxis = g => g\n .attr(\"transform\", `translate(0,${height - margin.bottom})`)\n .call(d3.axisBottom(x).ticks(widthBar / 100).tickSizeOuter(0))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":230,"value":"yAxis = g => g\n .attr(\"transform\", `translate(${margin.left},0)`)\n .call(d3.axisLeft(y))\n .call(g => g.select(\".domain\").remove())\n .call(g => g.select(\".tick:last-of-type text\").clone()\n .attr(\"x\", 3)\n .attr(\"text-anchor\", \"start\")\n .attr(\"font-weight\", \"bold\")\n .text(mData.y))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":234,"value":"bisect = {\n const bisect = d3.bisector(d => d.Year).left;\n return mx => {\n const Year = x.invert(mx);\n const index = bisect(mData, Year, 1);\n const a = Year[index - 1];\n const b = Year[index];\n return Year - a.Year > b.Year - Year ? b : a;\n };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":236,"value":"function transition(path) {\n path.transition()\n .duration(2000)\n .attrTween(\"stroke-dasharray\", tweenDash)\n .on(\"end\", () => { d3.select(this).call(transition); });\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":240,"value":"function tweenDash() {\n const l = this.getTotalLength(),\n i = d3.interpolateString(\"0,\" + l, l + \",\" + l);\n return function(t) { return i(t) };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":242,"value":"line = d3.line()\n .defined(d => !isNaN(d.Total))\n .x(d => x(d.Year))\n .y(d => y(d.Total))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":244,"value":"dataSelector","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":248,"value":"function updateData () {\n \n var mData = dataSelector === 'mData' ? mData: cData;\n \n y.domain( d3.extent( dataSelector, datapoint => datapoint.Total ) )\n \n x.domain( d3.extent( dataSelector, datapoint => datapoint.Year ) )\n \n var path = d3.select( '.chart__line' )\n .transition()\n .duration( 500 )\n .attr( 'd', line( mData ) );\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":250,"value":"md`#### map`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":252,"value":"height2 = 1000","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":254,"value":"html` \n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":256,"value":"elSalvador = FileAttachment(\"El Salvador.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":258,"value":"mexico = FileAttachment(\"Mexico.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":260,"value":"guatemala = FileAttachment(\"Guatemala.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":262,"value":"//Create an empty array, and combine (concatenate) all migration data together into it\nmigrationData = [].concat(elSalvador, mexico, guatemala)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":264,"value":"//computed us center is confused by Alaska+Hawaii, so here we just set it ourselves\n//https://en.wikipedia.org/wiki/Geographic_center_of_the_United_States\nusCentroid = [-103.75, 40]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":266,"value":"states = FileAttachment(\"gz_2010_us_040_00_5m.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":268,"value":"sourceScale = d3.scalePoint().domain(supportedSources).range([0, 1])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":272,"value":"//To read about what's happening here...\n//https://observablehq.com/@observablehq/introduction-to-generators\n{\n while (animated == true) {\n for (const year of supportedYears) {\n viewof selectedPeriod.value = year;\n viewof selectedPeriod.dispatchEvent(new Event(\"input\"));\n yield Promises.delay(5000);\n }\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":276,"value":"//for converting long-lat to pixels\nprojection = d3\n .geoAzimuthalEqualArea()\n .center([-10, -320])\n .scale(1200)\n //center on the Americas\n .rotate([90, 0, 0])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":280,"value":"targetScale = d3\n .scalePoint()\n .domain(states.features.map((d) => d.properties.NAME))\n .range([0, 1])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":284,"value":"activeMigrationValues = migrationData\n .filter((d) => selectedSources.includes(d.Hometown))\n .map((d) => d[selectedPeriod])\n .map((d) => parseInt(d))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":286,"value":"circleScale = d3.scaleLinear().domain(d3.extent(Object.values(totalMigration))).range([0,100])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":290,"value":"growScale = d3.scaleLinear().domain(d3.extent(Object.values(totalMigration))).range([1000,5000])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":294,"value":"totalMigration = {\n const names = statesWithMigrationData.features.map(d=>d.properties.NAME)\n \n const totalMigration = statesWithMigrationData.features\n //for loop through states\n .map(state=>state.migration\n //get value for all decade per country\n .map(d=>Object.values(d))\n //combine countries\n .flat()\n //remove words\n .filter(e=>Boolean(parseInt(e)))\n //convert to numbers\n .map(f=>parseInt(f)).reduce((acc,val)=>acc+val,0))\n\n\n return names.reduce((acc,val,index) => { acc[val] = totalMigration[index]; return acc }, {} )\n\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":296,"value":"parseInt(\"Mexico\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":300,"value":"[10,3,2].reduce((acc,val)=>acc+val,0)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":302,"value":"statesWithMigrationData = ({\n type: \"FeatureCollection\",\n features: states.features\n .map((state) => {\n return {\n ...state,\n migration: migrationData.filter(\n (d) => d.Destination == state.properties.NAME\n )\n };\n })\n .map((state) => ({\n ...state,\n centroid: d3.geoCentroid(state),\n\n trails: supportedGeoData.map((country) => ({\n type: \"Feature\",\n properties: {\n source: country.properties.name,\n target: state.properties.NAME,\n migration: migrationData\n .filter((d) => d.Destination == state.properties.NAME)\n .filter((d) => d.Hometown == country.properties.name)[0],\n distance: d3.geoDistance(\n d3.geoCentroid(state),\n d3.geoCentroid(country)\n )\n },\n geometry: {\n type: \"LineString\",\n coordinates: [d3.geoCentroid(country), d3.geoCentroid(state)]\n }\n }))\n }))\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":304,"value":"parseInt(\n statesWithMigrationData.features[0].migration.filter(\n (d) => d.Hometown == \"Mexico\"\n )[0][\"2010\"]\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":306,"value":"migrationScale = d3\n .scaleLinear()\n .domain(\n d3.extent(\n migrationData.filter((d) => selectedSources.includes(d.Hometown)),\n (d) => parseInt(d[selectedPeriod])\n )\n )\n .range([0, 1])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":308,"value":"//show min and maxes to ensure everything is working\nd3.extent(\n migrationData.filter((d) => selectedSources.includes(d.Hometown)),\n (d) => parseInt(d[selectedPeriod])\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":312,"value":"html` \n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":314,"value":"// viewof country = Inputs.radio(d3.group(refineData, d => d.country))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":316,"value":"//Find unique source countries from concatenated array\nsupportedSources = Array.from(new Set(migrationData.map((d) => d.Hometown)))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":318,"value":"supportedGeoData = supportedSources.map((d) =>\n countries.features.find((e) => e.properties.name == d)\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":320,"value":"northAmerica = ({\n type: \"FeatureCollection\",\n features: countries.features\n .filter((d) => d.properties.continent == \"North America\")\n .filter((d) => d.properties.name != \"United States\")\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":322,"value":"countries = FileAttachment(\"custom.geo-3.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":324,"value":"//Find all different column headers from first row in CSV file, and then remove the two that aren't time-related\nsupportedYears = Object.keys(migrationData[0])\n .filter((d) => d != \"Hometown\")\n .filter((d) => d != \"Destination\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":326,"value":"//for how many seconds the animaton will take, based on population\ndurationScale = d3.scaleLinear().domain(activeMigrationValues).range([20, 10])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":330,"value":"fakeScale = d3.scaleOrdinal().domain(supportedSources).range([\"#F9D9D6\",\"#F08D82\",\"#F4B1AB\"])\n// Swatches(d3.scaleOrdinal(['Flood','Drought','Storm','Wildfire','Extreme temperature'], (['#DD3429','#F38366','#E6E7E8', '#818185', '#393A3B'])));","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":332,"value":"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W39","stdlib":"1","titling":"auto"}} 33:"$32:body"