25:["$","title",null,{"children":"Final Project | Tae Yeon Kim's Workspace | Observable"}] 49:T509,In recent years, the United States has grappled with a complex and pressing issue that has far-reaching consequences on public safety, societal well-being, and policymaking—the pervasive problem of gun violence. For instance, in 2023 U.S surpasses 600 mass shootings according to [Forbes](https://www.forbes.com/sites/anafaguy/2023/11/14/us-surpasses-600-mass-shootings-this-year-nearing-record-levels/?sh=7984843a3328). As communities across the nation seek to understand, address, and ultimately reduce the incidence of gun-related incidents, the role of data visualization emerges as a powerful tool in shedding light on this multifaceted challenge. The goal of visualizing data on gun violence is to transform raw statistics into meaningful insights, ultimately providing a comprehensive and accessible understanding of the patterns, trends, and underlying factors associated with these incidents. In this exploration of visualizing gun violence data in the United States, we want to understand the intricate layers of this societal challenge. By harnessing the power of visualization, we aim to empower individuals with the knowledge needed to catalyze meaningful action, promote public discourse, and contribute to the collective endeavor of fostering safer communities for all. 4a:T4a7,The [Gun Violence Archive](https://www.gunviolencearchive.org/) collects data from various sources, including media reports, law enforcement, and public records. The archive aims to provide a comprehensive and up-to-date record of gun-related incidents, encompassing not only mass shootings but also individual cases such as suicides, homicides, and accidental discharges. Key components of the data available on platforms like the Gun Violence Archive include: Incident Details: Information about each incident, including the date, time, and location (city and state). Victim Information: Demographic details about the victims, such as age, gender, and any available information about their relationship to the perpetrator. Shooting Types: Categorization of incidents based on the nature of the shooting, such as mass shootings, domestic violence-related shootings, gang-related incidents, and accidental discharges. Fatalities and Injuries: Data on the number of fatalities and injuries resulting from each incident. Geospatial Data: Mapping features that allow users to visualize the geographic distribution of gun violence incidents. This can help identify patterns and hotspots. 4b:T737,fc_group_by_day = function fc_group_by_day(data) { var dt = "" const map = new Map(); data.forEach(row => { var date = row["data"].split(',')[0].split('/') var day = date[0] var month = date[1] var year = date[2] var key = `${month}-${day}-${year}` if (map.get(key) === undefined){ var pa = 0 if (row["police_action"] === true){ pa = 1; } map.set(key, {"key": key, "Incidents": 1, "Police Action": pa, "civilians_dead": parseInt(row["civilians_dead"]), "civilians_wounded": parseInt(row["civilians_wounded"]), "values": [row]}) }else{ var obj = map.get(key) var values = obj["values"]; values.push(row); obj["values"] = values; var pa = 0 if (row["police_action"] === true){ pa = 1; } obj["Incidents"] = obj["Incidents"]+1; obj["Police Action"] = obj["Police Action"]+pa; obj["civilians_dead"] = obj["civilians_dead"]+parseInt(row["civilians_dead"]); obj["civilians_wounded"] = obj["civilians_wounded"]+parseInt(row["civilians_wounded"]); map.set(key, obj); } }) const arr = new Array(); const keys = map.keys(); for (const k of keys){ const value = map.get(k); var d = k.split('-'); var month = parseInt(d[0]) - 1; var day = parseInt(d[1]); var year = d[2]; var dt = new Date(year, month, day); value["date"] = dt; var item = {date: dt, label: "Incidents", value: value["Incidents"], key: k} arr.push(item) item = {date: dt, label: "Police Action", value: value["Police Action"], key: k} arr.push(item) item = {date: dt, label: "civilians_dead", value: value["civilians_dead"], key: k} arr.push(item) item = {date: dt, label: "civilians_wounded", value: value["civilians_wounded"], key: k} arr.push(item) } return arr; }4c:T714,fc_group_by_month = function fc_group_by_month(data) { var dt = "" const map = new Map(); data.forEach(row => { var date = row["data"].split(',')[0].split('/') var day = date[0] var month = date[1] var year = date[2] var key = `${month}-${year}` if (map.get(key) === undefined){ var pa = 0 if (row["police_action"] === true){ pa = 1; } map.set(key, {"key": key, "Incidents": 1, "Police Action": pa, "civilians_dead": parseInt(row["civilians_dead"]), "civilians_wounded": parseInt(row["civilians_wounded"]), "values": [row]}) }else{ var obj = map.get(key) var values = obj["values"]; values.push(row); obj["values"] = values; var pa = 0 if (row["police_action"] === true){ pa = 1; } obj["Incidents"] = obj["Incidents"]+1; obj["Police Action"] = obj["Police Action"]+pa; obj["civilians_dead"] = obj["civilians_dead"]+parseInt(row["civilians_dead"]); obj["civilians_wounded"] = obj["civilians_wounded"]+parseInt(row["civilians_wounded"]); map.set(key, obj); } }) const arr = new Array(); const keys = map.keys(); for (const k of keys){ const value = map.get(k); var d = k.split('-'); var month = parseInt(d[0]) - 1; var year = d[1]; var dt = new Date(year, month, 0); value["date"] = dt; var item = {date: dt, label: "Incidents", value: value["Incidents"], key: k} arr.push(item) item = {date: dt, label: "Police Action", value: value["Police Action"], key: k} arr.push(item) item = {date: dt, label: "civilians_dead", value: value["civilians_dead"], key: k} arr.push(item) item = {date: dt, label: "civilians_wounded", value: value["civilians_wounded"], key: k} arr.push(item) } return arr; }4d:T696,fc_group_by_year = function fc_group_by_year(data) { var dt = "" const map = new Map(); data.forEach(row => { var date = row["data"].split(',')[0].split('/') var year = date[2] var key = `${year}` if (map.get(key) === undefined){ var pa = 0 if (row["police_action"] === true){ pa = 1; } map.set(key, {"key": key, "Incidents": 1, "Police Action": pa, "civilians_dead": parseInt(row["civilians_dead"]), "civilians_wounded": parseInt(row["civilians_wounded"]), "values": [row]}) }else{ var obj = map.get(key) var values = obj["values"]; values.push(row); obj["values"] = values; var pa = 0 if (row["police_action"] === true){ pa = 1; } obj["Incidents"] = obj["Incidents"]+1; obj["Police Action"] = obj["Police Action"]+pa; obj["civilians_dead"] = obj["civilians_dead"]+parseInt(row["civilians_dead"]); obj["civilians_wounded"] = obj["civilians_wounded"]+parseInt(row["civilians_wounded"]); map.set(key, obj); } }) const arr = new Array(); const keys = map.keys(); for (const k of keys){ const value = map.get(k); var year = k; var dt = new Date(year, 0, 0); value["date"] = dt; var item = {date: dt, label: "Incidents", value: value["Incidents"], key: k} arr.push(item) item = {date: dt, label: "Police Action", value: value["Police Action"], key: k} arr.push(item) item = {date: dt, label: "civilians_dead", value: value["civilians_dead"], key: k} arr.push(item) item = {date: dt, label: "civilians_wounded", value: value["civilians_wounded"], key: k} arr.push(item) } return arr; }4e:T7ed,group_by_month = function group_by_month(data){ var dt = "" const map = new Map(); data.forEach(row => { dt = Date.parse(row["Incident Date"]); dt = new Date(dt); var month = dt.getMonth()+1; var year = dt.getFullYear(); var day = dt.getDay(); var key = `${month}-${day}-${year}` if (map.get(key) === undefined){ map.set(key, {"key": key, "Incidents": 1, "Victims Killed": parseInt(row["Victims Killed"]), "Victims Injured": parseInt(row["Victims Injured"]), "Suspects Killed": parseInt(row["Suspects Killed"]), "Suspects Injured": parseInt(row["Suspects Injured"]), "values": [row]}) }else{ var obj = map.get(key) var values = obj["values"]; values.push(row); obj["values"] = values; obj["Incidents"] = obj["Incidents"]+1; obj["Victims Killed"] = obj["Victims Killed"]+parseInt(row["Victims Killed"]); obj["Victims Injured"] = obj["Victims Injured"]+parseInt(row["Victims Injured"]); obj["Suspects Killed"] = obj["Suspects Killed"]+parseInt(row["Suspects Killed"]); obj["Suspects Injured"] = obj["Suspects Injured"]+parseInt(row["Suspects Injured"]); map.set(key, obj); } }) const arr = new Array(); const keys = map.keys(); for (const k of keys){ const value = map.get(k); var d = k.split('-'); var month = parseInt(d[0]) - 1; var day = parseInt(d[1]); var year = d[2]; var dt = new Date(year, month, day); value["date"] = dt; var item = {date: dt, label: "Incidents", value: value["Incidents"], key: k} arr.push(item) item = {date: dt, label: "Victims Injured", value: value["Victims Injured"], key: k} arr.push(item) item = {date: dt, label: "Victims Killed", value: value["Victims Killed"], key: k} arr.push(item) item = {date: dt, label: "Suspects Killed", value: value["Suspects Killed"], key: k} arr.push(item) item = {date: dt, label: "Suspects Injured", value: value["Suspects Injured"], key: k} arr.push(item) } return arr }4f:T109f,chart = { const width = 1200; const height = 600; const marginTop = 20; const marginRight = 20; const marginBottom = 30; const marginLeft = 30; // Create the positional scales. const x = d3.scaleTime([new Date(years_range[0],0), new Date(years_range[1],0)],[marginLeft, width - marginRight]); const y = d3.scaleLinear() .domain([0, d3.max(data_grouped_by_month, d=>d.value)]).nice() .range([height - marginBottom, marginTop]); // Create the SVG container. const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .attr("style", "max-width: 100%; height: auto; overflow: visible; font: 10px sans-serif;"); function filter_by_label_and_date() { var aux = data_grouped_by_month.filter(function (row) { if (row.date >= new Date(years_range[0], 0) && row.date <= new Date(years_range[1], 0)){ return true; }else { return false; } }); return aux.filter(d=>labels.includes(d.label)); } // d3.select("#selectButton") // .selectAll('myOptions') // .data(labels) // .enter() // .append('option') // .text(function (d) { return d; }) // text showed in the menu // .attr("value", function (d) { return d; }) // corresponding value returned by the button // Add the horizontal axis. svg.append("g") .attr("transform", `translate(0,${height - marginBottom})`) .call(d3.axisBottom(x)) //.ticks(width / 80).tickSizeOuter(0)); // Add the vertical axis. svg.append("g") .attr("transform", `translate(${marginLeft},0)`) .call(d3.axisLeft(y)) //.tickFormat(formatBillions) .call(g => g.select(".domain").remove()) // .call(voronoi ? () => {} : g => g.selectAll(".tick line").clone() // .attr("x2", width - marginLeft - marginRight) // .attr("stroke-opacity", 0.1)) .call(g => g.append("text") .attr("x", -marginLeft) .attr("y", 10) .attr("fill", "currentColor") .attr("text-anchor", "start") .text("")); // Compute the points in pixel space as [x, y, z, k], where z is the name of the series and k is the difference. var current_data = filter_by_label_and_date(); const points = current_data.map((d) => [x(d.date), y(d.value), d.label]); // Group the points by series. const groups = d3.rollup(points, v => Object.assign(v, {z: v[0][2]}), d => d[2]); console.log(groups) // Draw the lines. const line = d3.line(); const path = svg.append("g") .attr("fill", "none") .attr("stroke", "red") .attr("stroke-width", 1.5) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .selectAll("path") .data(groups.values()) .join("path") .style("mix-blend-mode", "multiply") .attr("d", line) .attr("stroke", map_colors.get(d=>d[2])); // Add an invisible layer for the interactive tip. const dot = svg.append("g") .attr("display", "none"); dot.append("circle") .attr("r", 2.5); dot.append("text") .attr("text-anchor", "middle") .attr("y", -8); svg .on("pointerenter", pointerentered) .on("pointermove", pointermoved) .on("pointerleave", pointerleft) .on("touchstart", event => event.preventDefault()); return svg.node(); function pointermoved(event) { const [xm, ym] = d3.pointer(event); const i = d3.leastIndex(points, ([x, y]) => Math.hypot(x - xm, y - ym)); const [x, y, k1, k2] = points[i]; path.style("stroke", ({z}) => z === k1 ? null : "#ddd").filter(({z}) => z === k1).raise(); dot.attr("transform", `translate(${x},${y})`); dot.select("text").text(`${k1}, Payment Method: ${k2.payment_method}, Ridership: ${k2.ridership}`); svg.property("value", current_data[i]).dispatch("input", {bubbles: true}); } function pointerentered() { path.style("mix-blend-mode", null).style("stroke", "#ddd"); dot.attr("display", null); } function pointerleft() { path.style("mix-blend-mode", "multiply").style("stroke", null); dot.attr("display", "none"); svg.node().value = null; svg.dispatch("input", {bubbles: true}); } }50:T13a9,chart2 = { const width = 1200; const height = 600; const marginTop = 20; const marginRight = 20; const marginBottom = 30; const marginLeft = 30; // Create the positional scales. const x = d3.scaleTime([new Date(years_range1[0],0), new Date(years_range1[1],0)],[marginLeft, width - marginRight]); var maximum = d3.max(fc_grouped_by_day, d=>d.value); if (grouped_by === "Day"){ maximum = d3.max(fc_grouped_by_day, d=>d.value); }else if (grouped_by === "Month"){ maximum = d3.max(fc_grouped_by_month, d=>d.value) }else{ maximum = d3.max(fc_grouped_by_year, d=>d.value) } const y = d3.scaleLinear().domain([0, maximum]).nice().range([height - marginBottom, marginTop]); // Create the SVG container. const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .attr("style", "max-width: 100%; height: auto; overflow: visible; font: 10px sans-serif;"); function filter_by_label_and_date() { var aux = fc_grouped_by_day.filter(function (row) { if (row.date >= new Date(years_range1[0], 0) && row.date <= new Date(years_range1[1], 0)){ return true; }else { return false; } }); if (grouped_by === "Month"){ aux = fc_grouped_by_month.filter(function (row) { if (row.date >= new Date(years_range1[0], 0) && row.date <= new Date(years_range1[1], 0)){ return true; }else { return false; } }); }else if(grouped_by === "Year"){ aux = fc_grouped_by_year.filter(function (row) { if (row.date >= new Date(years_range1[0], 0) && row.date <= new Date(years_range1[1], 0)){ return true; }else { return false; } }); } return aux.filter(d=>labels2.includes(d.label)); } // d3.select("#selectButton") // .selectAll('myOptions') // .data(labels) // .enter() // .append('option') // .text(function (d) { return d; }) // text showed in the menu // .attr("value", function (d) { return d; }) // corresponding value returned by the button // Add the horizontal axis. svg.append("g") .attr("transform", `translate(0,${height - marginBottom})`) .call(d3.axisBottom(x)) //.ticks(width / 80).tickSizeOuter(0)); // Add the vertical axis. svg.append("g") .attr("transform", `translate(${marginLeft},0)`) .call(d3.axisLeft(y)) //.tickFormat(formatBillions) .call(g => g.select(".domain").remove()) // .call(voronoi ? () => {} : g => g.selectAll(".tick line").clone() // .attr("x2", width - marginLeft - marginRight) // .attr("stroke-opacity", 0.1)) .call(g => g.append("text") .attr("x", -marginLeft) .attr("y", 10) .attr("fill", "currentColor") .attr("text-anchor", "start") .text("")); // Compute the points in pixel space as [x, y, z, k], where z is the name of the series and k is the difference. var current_data = filter_by_label_and_date(); const points = current_data.map((d) => [x(d.date), y(d.value), d.label]); // Group the points by series. const groups = d3.rollup(points, v => Object.assign(v, {z: v[0][2]}), d => d[2]); console.log(groups) // Draw the lines. const line = d3.line(); const path = svg.append("g") .attr("fill", "none") .attr("stroke", "red") .attr("stroke-width", 1.5) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .selectAll("path") .data(groups.values()) .join("path") .style("mix-blend-mode", "multiply") .attr("d", line) .attr("stroke", map_colors2.get(d=>d[2])); // Add an invisible layer for the interactive tip. const dot = svg.append("g") .attr("display", "none"); dot.append("circle") .attr("r", 2.5); dot.append("text") .attr("text-anchor", "middle") .attr("y", -8); svg .on("pointerenter", pointerentered) .on("pointermove", pointermoved) .on("pointerleave", pointerleft) .on("touchstart", event => event.preventDefault()); return svg.node(); function pointermoved(event) { const [xm, ym] = d3.pointer(event); const i = d3.leastIndex(points, ([x, y]) => Math.hypot(x - xm, y - ym)); const [x, y, k1, k2] = points[i]; path.style("stroke", ({z}) => z === k1 ? null : "#ddd").filter(({z}) => z === k1).raise(); dot.attr("transform", `translate(${x},${y})`); dot.select("text").text(`${k1}, Payment Method: ${k2.payment_method}, Ridership: ${k2.ridership}`); svg.property("value", current_data[i]).dispatch("input", {bubbles: true}); } function pointerentered() { path.style("mix-blend-mode", null).style("stroke", "#ddd"); dot.attr("display", null); } function pointerleft() { path.style("mix-blend-mode", "multiply").style("stroke", null); dot.attr("display", "none"); svg.node().value = null; svg.dispatch("input", {bubbles: true}); } }51:T14c7,chart3 = { const months_map = new Map([[1, "Jan"], [2, "Feb"], [3, "Mar"], [4, "Apr"], [5, "May"], [6, "Jun"], [7, "Jul"], [8, "Aug"], [9, "Sep"], [10, "Oct"], [11, "Nov"], [12, "Dec"]]); const width = 1200; const height = 600; const marginTop = 20; const marginRight = 20; const marginBottom = 30; const marginLeft = 30; // Create the positional scales. const x = d3.scaleLinear().domain([1,12]).nice().range([marginLeft, width - marginRight]) // scaleTime([0, 365],); var maximum = d3.max(fc_grouped_by_month.filter(d=>labels2.includes(d.label)), d=>d.value) const y = d3.scaleLinear().domain([0, maximum]).nice().range([height - marginBottom, marginTop]); // Create the SVG container. const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .attr("style", "max-width: 100%; height: auto; overflow: visible; font: 10px sans-serif;"); function filter_by_label_and_date() { var aux = fc_grouped_by_month.filter(function (row) { if (row.date >= new Date(years_range1[0], 0) && row.date <= new Date(years_range1[1], 0)){ return true; }else { return false; } }); return aux.filter(d=>labels2.includes(d.label)); } // d3.select("#selectButton") // .selectAll('myOptions') // .data(labels) // .enter() // .append('option') // .text(function (d) { return d; }) // text showed in the menu // .attr("value", function (d) { return d; }) // corresponding value returned by the button // Add the horizontal axis. svg.append("g") .attr("transform", `translate(0,${height - marginBottom})`) .call(d3.axisBottom(x)) //.ticks(width / 80).tickSizeOuter(0)); .call(g => g.append("text") .attr("x", width - 25) .attr("y", 30) .attr("fill", "currentColor") .attr("text-anchor", "start") .text("(Month)")); // Add the vertical axis. svg.append("g") .attr("transform", `translate(${marginLeft},0)`) .call(d3.axisLeft(y)) //.tickFormat(formatBillions) .call(g => g.select(".domain").remove()) // .call(voronoi ? () => {} : g => g.selectAll(".tick line").clone() // .attr("x2", width - marginLeft - marginRight) // .attr("stroke-opacity", 0.1)) .call(g => g.append("text") .attr("x", -marginLeft) .attr("y", 10) .attr("fill", "currentColor") .attr("text-anchor", "start") .text("")); function days_between(date1, date2) { const oneDay = 24 * 60 * 60 * 1000; // hours*minutes*seconds*milliseconds const firstDate = new Date(date1.getFullYear(), date1.getMonth(), date1.getDay()); const secondDate = new Date(date2.getFullYear(), date2.getMonth(), date2.getDay()); const diffDays = Math.round(Math.abs((firstDate - secondDate) / oneDay)); return diffDays; } // Compute the points in pixel space as [x, y, z, k], where z is the name of the series and k is the difference. var current_data = filter_by_label_and_date(); const points = current_data.map((d) => [x(d.date.getMonth()+1), y(d.value), d.date.getFullYear(), d.value, d.label, d.date.getMonth()+1]); // Group the points by series. const groups = d3.rollup(points, v => Object.assign(v, {z: v[0][2]}), d => d[2]); // Draw the lines. const line = d3.line(); const path = svg.append("g") .attr("fill", "none") .attr("stroke", "red") .attr("stroke-width", 1.5) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .selectAll("path") .data(groups.values()) .join("path") .style("mix-blend-mode", "multiply") .attr("d", line) .attr("stroke", d=>color_chart3(d)) .attr("stroke-width", 5) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round"); // Add an invisible layer for the interactive tip. const dot = svg.append("g") .attr("display", "none"); dot.append("circle") .attr("r", 6); dot.append("text") .attr("text-anchor", "start") .attr("y", -8); svg .on("pointerenter", pointerentered) .on("pointermove", pointermoved) .on("pointerleave", pointerleft) .on("touchstart", event => event.preventDefault()); return svg.node(); function pointermoved(event) { const [xm, ym] = d3.pointer(event); const i = d3.leastIndex(points, ([x, y]) => Math.hypot(x - xm, y - ym)); const [x, y, k1, k2, k3, k4] = points[i]; path.style("stroke", ({z}) => z === k1 ? null : "#ddd").filter(({z}) => z === k1).raise(); dot.attr("transform", `translate(${x},${y})`); dot.select("text") .attr("font-size", "20") .attr("background-color", "red") .text(`${months_map.get(k4)}/${k1}, Num. of ${k3} is ${k2}`); svg.property("value", current_data[i]).dispatch("input", {bubbles: true}); } function pointerentered() { path.style("mix-blend-mode", null).style("stroke", "#ddd"); dot.attr("display", null); } function pointerleft() { path.style("mix-blend-mode", "multiply").style("stroke", null); dot.attr("display", "none"); svg.node().value = null; svg.dispatch("input", {bubbles: true}); } }52:T721,1. **Temporal Trends:** - What are the overall trends in gun violence incidents over the past decade? - Are there noticeable patterns or fluctuations in gun violence based on the time of day, day of the week, or month? 2. **Geographic Analysis:** - Which states or cities experience the highest rates of gun violence? - Are there geographical clusters or hotspots of gun violence incidents? 3. **Demographic Analysis:** - What demographic factors (age, gender, etc.) are associated with higher rates of victimization or perpetration? - Are there discernible trends in the relationship between the victim and the perpetrator? 4. **Firearm Types:** - What types of firearms are most commonly involved in gun violence incidents? - Are there trends in the use of specific types of weapons over time? 5. **Mass Shootings:** - How frequently do mass shootings occur, and what are the common characteristics of these incidents? - Is there a correlation between the prevalence of mass shootings and specific factors, such as geographic location or social dynamics? 6. **Circumstances and Motivations:** - What are the most common circumstances or motivations associated with gun violence incidents (e.g., domestic violence, gang-related, etc.)? - Are there seasonal or situational variations in the motives behind gun violence? 7. **Fatalities and Injuries:** - What is the ratio of fatalities to injuries in gun violence incidents? - Are there specific factors that contribute to a higher likelihood of fatalities? 8. **Preventive Measures:** - Are there correlations between changes in legislation and subsequent shifts in gun violence rates? 9. ** Impact of gun permitting** - Is there any correlation between gun permitting and the number of incidents in a city? 53:[{"id":"81d83525db69e3b52732a6a82356918bac4af6f786dfa806b79c0a96c60c1f3841980612c5b63d9684370c095197e76678003c4e3bb82b54fd69e9b1dc968c2f","href":"https://static.observableusercontent.com/files/81d83525db69e3b52732a6a82356918bac4af6f786dfa806b79c0a96c60c1f3841980612c5b63d9684370c095197e76678003c4e3bb82b54fd69e9b1dc968c2f","name":"export-865fbf81-5a78-44ea-a7fb-aaf2a4db3545.csv","type":"text/csv","lastModified":1702453319990.991,"size":172120},{"id":"12a506c048d95241b89899225a9d3d8d44344c9b925bf1fae63035e5f9fb54ef6157b828a6a42ee17ef80e74a18cd354ed924ccf3e89ae307f9b09bcbadaa26f","href":"https://static.observableusercontent.com/files/12a506c048d95241b89899225a9d3d8d44344c9b925bf1fae63035e5f9fb54ef6157b828a6a42ee17ef80e74a18cd354ed924ccf3e89ae307f9b09bcbadaa26f","name":"fc-2016.csv","type":"text/csv","lastModified":1702453319990.991,"size":550252},{"id":"86170c7856e0ed39c5987f4469ce088ee3c460dab052dbd56ebac619d094f24726b0e0601e92ee01cb1b5921b74d1ec3f4208c5f8b4046ec7e93e3319da3f9a3","href":"https://static.observableusercontent.com/files/86170c7856e0ed39c5987f4469ce088ee3c460dab052dbd56ebac619d094f24726b0e0601e92ee01cb1b5921b74d1ec3f4208c5f8b4046ec7e93e3319da3f9a3","name":"fc-2023.csv","type":"text/csv","lastModified":1702453319990.991,"size":741657},{"id":"940be9bd7e92c99413643c98ee3e70b9957048a398ce35a9c1eae3ff56365f94506a56fbc730ab2574f2757078bdc651ffdf2e65c54f494eeb3e605b276ff240","href":"https://static.observableusercontent.com/files/940be9bd7e92c99413643c98ee3e70b9957048a398ce35a9c1eae3ff56365f94506a56fbc730ab2574f2757078bdc651ffdf2e65c54f494eeb3e605b276ff240","name":"fc-2019.csv","type":"text/csv","lastModified":1702453319990.991,"size":1871861},{"id":"faaff25ecb927251c597b40a89b95b4283c2d82a65fd916f3f6f40868dd92755dcb74fce92240908f6a23cb7c87c5d68e40777c24121f4986a368d5878607777","href":"https://static.observableusercontent.com/files/faaff25ecb927251c597b40a89b95b4283c2d82a65fd916f3f6f40868dd92755dcb74fce92240908f6a23cb7c87c5d68e40777c24121f4986a368d5878607777","name":"fc-2022.csv","type":"text/csv","lastModified":1702453319990.991,"size":913976},{"id":"320916ee929849cad3a09e42d42fa07e3ef1cfc17bffb97a0c9f881c59687d5232a3d3f59c9804f5891b4d60787a6171df35c3db722bbb983efd8abc8594453b","href":"https://static.observableusercontent.com/files/320916ee929849cad3a09e42d42fa07e3ef1cfc17bffb97a0c9f881c59687d5232a3d3f59c9804f5891b4d60787a6171df35c3db722bbb983efd8abc8594453b","name":"fc-2020.csv","type":"text/csv","lastModified":1702453319990.991,"size":1159057},{"id":"1453bfc7c9cb28f39ca71258b42df90434b8ff5f63f9b35a048375f1b9e8e399f014c29b3f97189585ceb4b662f7b64adbb2aa6bb7bde7cd702e6d1b614a3bd1","href":"https://static.observableusercontent.com/files/1453bfc7c9cb28f39ca71258b42df90434b8ff5f63f9b35a048375f1b9e8e399f014c29b3f97189585ceb4b662f7b64adbb2aa6bb7bde7cd702e6d1b614a3bd1","name":"fc-2018.csv","type":"text/csv","lastModified":1702453319990.991,"size":2431617},{"id":"6fd5e862a30b1e0088a85d25164d856addf5204b4c66415167768e53081e4e3862a2ec129abbe30b81fa529a303a6218454f86112f442f1c0a9769c421c3d3aa","href":"https://static.observableusercontent.com/files/6fd5e862a30b1e0088a85d25164d856addf5204b4c66415167768e53081e4e3862a2ec129abbe30b81fa529a303a6218454f86112f442f1c0a9769c421c3d3aa","name":"fc-2017.csv","type":"text/csv","lastModified":1702453319990.991,"size":1345494},{"id":"1dea61ec77de8195c16bcedd1cfeab6bf77e04e5273c079aaad3ce26c8ae353c9c8a85d653cc0dc4a69eeb59b1b7a9ccbd6929808b8b600dda91dd6202c1eac1","href":"https://static.observableusercontent.com/files/1dea61ec77de8195c16bcedd1cfeab6bf77e04e5273c079aaad3ce26c8ae353c9c8a85d653cc0dc4a69eeb59b1b7a9ccbd6929808b8b600dda91dd6202c1eac1","name":"fc-2021.csv","type":"text/csv","lastModified":1702453319990.991,"size":1201881}] 29:{"id":"1b3256b3f05fe6c7","slug":null,"title":"Final Project","thumbnail":"7908b4fbf7ea7f8a9abe5b41fb01c270237b6bcfa3c664d5fdf6d856572f07be","access_level":"public","create_time":"$D2023-12-13T07:41:59.990Z","update_time":"$D2023-12-13T07:41:59.990Z","view_time":null,"first_public_time":"$D2023-12-13T07:41:59.990Z","has_unpublished_edits":null,"fork":{"id":"a1141831b1b42b70","slug":null,"title":"Final Project","owner":{"id":"4863d8b12a7dd8ec","login":"felipe-de-oliveira2-ws","name":"Felipe de Oliveira's Workspace"}},"stars":0,"starred":false,"owner":{"type":"team","id":"5b6a0a96f215e68f","login":"tae-yeon-kim-ws","name":"Tae Yeon Kim's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/b5a0efab143756ae0f0e8f7d132b1af9f7457bb35827295ad1652288b2b95ee1","tier":"starter_2024","bio":"","following":false},"version":430,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"da00915aaf2305b2","login":"tae-yeon-kim","name":"Tae Yeon Kim","avatar_url":"https://avatars-next.observableusercontent.com/6097f0d7309d5dab799bb882fa9763269f913d1a3dc9abb924b5f04100dcf02a","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"da00915aaf2305b2","login":"tae-yeon-kim","name":"Tae Yeon Kim","avatar_url":"https://avatars-next.observableusercontent.com/6097f0d7309d5dab799bb882fa9763269f913d1a3dc9abb924b5f04100dcf02a","tier":null,"role":"editor"},{"type":"team","id":"5b6a0a96f215e68f","login":"tae-yeon-kim-ws","name":"Tae Yeon Kim's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/b5a0efab143756ae0f0e8f7d132b1af9f7457bb35827295ad1652288b2b95ee1","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Final Project","cells":[{"id":0,"value":"md`# Final Project\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"md` # Analyzing the Anatomy of U.S. Gun Violence: Unveiling Patterns, Causes, and Solutions through Data Exploration`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"Felipe de Oliveira & TaeYeon Kim","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"md`## Introduction`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":116,"value":"$49","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":24,"value":"md`## Dataset`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"$4a","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":123,"value":"export865fbf815a7844eaA7fbAaf2a4db3545 = await FileAttachment(\"export-865fbf81-5a78-44ea-a7fb-aaf2a4db3545.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"export865fbf815a7844eaA7fbAaf2a4db3545","database":"$undefined"},{"id":152,"value":"raw_data = FileAttachment(\"export-865fbf81-5a78-44ea-a7fb-aaf2a4db3545.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":283,"value":"fogo_cruzado_raw = {\n var data_1 = d3.csvParse(await FileAttachment(\"fc-2016.csv\").text(), d3.autoType);\n var data_2 = d3.csvParse(await FileAttachment(\"fc-2017.csv\").text(), d3.autoType);\n var data_3 = d3.csvParse(await FileAttachment(\"fc-2018.csv\").text(), d3.autoType);\n var data_4 = d3.csvParse(await FileAttachment(\"fc-2019.csv\").text(), d3.autoType);\n var data_5 = d3.csvParse(await FileAttachment(\"fc-2020.csv\").text(), d3.autoType);\n var data_6 = d3.csvParse(await FileAttachment(\"fc-2021.csv\").text(), d3.autoType);\n var data_7 = d3.csvParse(await FileAttachment(\"fc-2022.csv\").text(), d3.autoType);\n var data_8 = d3.csvParse(await FileAttachment(\"fc-2023.csv\").text(), d3.autoType);\n\n var fc_all = data_1.concat(data_2)\n fc_all = fc_all.concat(data_3)\n fc_all = fc_all.concat(data_4)\n fc_all = fc_all.concat(data_5)\n fc_all = fc_all.concat(data_6)\n fc_all = fc_all.concat(data_7)\n fc_all = fc_all.concat(data_8)\n return fc_all\n} ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":289,"value":"$4b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":332,"value":"$4c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":344,"value":"$4d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":292,"value":"fc_grouped_by_day = fc_group_by_day(fogo_cruzado_raw).slice().sort((a,b)=>d3.ascending(a.date, b.date))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":341,"value":"fc_grouped_by_month = fc_group_by_month(fogo_cruzado_raw).slice().sort((a,b)=>d3.ascending(a.date, b.date))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":347,"value":"fc_grouped_by_year = fc_group_by_year(fogo_cruzado_raw).slice().sort((a,b)=>d3.ascending(a.date, b.date))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":147,"value":"$4e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":156,"value":"data_grouped_by_month = group_by_month(raw_data).slice().sort((a,b)=>d3.ascending(a.date, b.date))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":181,"value":"times = d3.utcYears(Date.UTC(2014, 0, 1), Date.UTC(2024, 0, 1))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":183,"value":"// d3 = require.alias({\n// \"d3-array\": \"d3@5\",\n// \"d3-axis\": \"d3@5\",\n// \"d3-dispatch\": \"d3@5\",\n// \"d3-drag\": \"d3@5\",\n// \"d3-ease\": \"d3@5\",\n// \"d3-scale\": \"d3@5\",\n// \"d3-selection\": \"d3@5\",\n// \"d3-transition\": \"d3@5\"\n// })(\"d3@5\", \"d3-simple-slider@1\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":178,"value":"// viewof startYear = {\n\n// const slider = d3.sliderBottom()\n// .min(d3.min(times))\n// .max(d3.max(times))\n// .marks(times)\n// .width(300)\n// .tickFormat(d3.utcFormat(\"%Y\"))\n// .tickValues(times)\n// .on(\"onchange\", () => svg.dispatch(\"input\"));\n\n// const svg = d3.create(\"svg\")\n// .attr(\"viewBox\", [-20, -20, 340, 60])\n// .attr(\"width\", 340)\n// .attr(\"height\", 60)\n// .call(slider);\n\n// return Object.defineProperty(\n// svg.node(), \n// \"value\", \n// {get: () => slider.value()}\n// );\n// }","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":189,"value":"import {rangeSlider} from '@mootari/range-slider'","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":222,"value":"colors = [\n {\"view\": 'Incidents', \"color\": \"red\"},\n {\"view\": 'Victims Killed', \"color\": \"blue\"},\n {\"view\": 'Victims Injured', \"color\": \"green\"},\n {\"view\": 'Suspects Killed', \"color\": \"orange\"}\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":265,"value":"map_colors = new Map([['Incidents', \"red\"],['Victims Killed', \"blue\"],['Victims Injured', \"green\"],['Suspects Killed',\"orange\"]])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":195,"value":"viewof years_range = rangeSlider({\n min: 2012,\n max: 2024,\n step: 1,\n value: [new Date(2012, 0,0), new Date(2024, 0,0)],\n title: 'Select Years',\n description: 'Please select start and end years',\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":216,"value":"viewof visualization = Inputs.checkbox(colors, {value: [{\"view\": 'Incidents', \"color\": \"red\"}], label: html`Options`, format: x => html`${x.view}`, disabled: []})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":234,"value":"labels = visualization.map(d=>d.view)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":176,"value":"$4f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":351,"value":"viewof grouped_by = Inputs.select([\"Day\", \"Month\", \"Year\"], {value: \"steelblue\", label: \"Data Grouped By\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":304,"value":"colors2 = [\n {\"view\": 'Incidents', \"color\": \"red\"},\n {\"view\": 'Victims Killed', \"color\": \"blue\"},\n {\"view\": 'Victims Injured', \"color\": \"green\"},\n {\"view\": 'Police Action', \"color\": \"orange\"}\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":307,"value":"map_colors2 = new Map([['Incidents', \"red\"],['Victims Killed', \"blue\"],['Victims Injured', \"green\"],['Police Action',\"orange\"]])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":301,"value":"viewof years_range1 = rangeSlider({\n min: 2016,\n max: 2024,\n step: 1,\n value: [new Date(2016, 0,0), new Date(2024, 0,0)],\n title: 'Select Years',\n description: 'Please select start and end years',\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":311,"value":"viewof visualization2 = Inputs.checkbox(colors2, {value: ['Incidents'], label: html`Options`, format: x => html`${x.view}`, disabled: []})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":317,"value":"labels2 = {\n var labels = new Array(); \n visualization2.forEach(l => {\n var view = l[\"view\"]\n if (view === \"Victims Killed\"){\n labels.push(\"civilians_dead\");\n }else if (view === \"Victims Injured\"){\n labels.push(\"civilians_wounded\")\n }else{\n labels.push(l.view)\n }\n })\n return labels;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":315,"value":"$50","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":398,"value":"color_chart3 = d3.scaleOrdinal(d3.schemeCategory10)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":357,"value":"$51","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"md`## Questions`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":126,"value":"$52","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"}],"files":"$W53","stdlib":"1"}} 24:null