31:Ta14,stacked_hist = function(data, title, style) { const dimensions = { width: width, height: style.height, margin: style.margin } let age_gender_columns = ['age', 'female', 'male', 'trans']; let stack = d3.stack().keys(age_gender_columns.slice(1))(data) let colorCat = d3.schemeYlOrRd[stack.length]; const svg_hist = d3.create("svg") .attr("viewBox", [0, 0, dimensions.width, dimensions.height]) .style("background", "white"); let xScale = d3.scaleBand() .domain(data.map(d => +d.age)) .range([dimensions.margin, dimensions.width - dimensions.margin]) .padding(0.08); let yScale = d3.scaleLinear() .domain([0,d3.max(stack, d => d3.max(d, d=> d[1]))]).nice() .range([dimensions.height - dimensions.margin, dimensions.margin]) let xAxis = d3.axisBottom(xScale) let yAxis = d3.axisLeft(yScale) svg_hist.append("g") .call(xAxis) .attr("transform", `translate(0,${dimensions.height - dimensions.margin})`) .selectAll("text") .attr("y", 0) .attr("x", 9) .attr("dy", ".35em") .attr("transform", "rotate(90)") .style("text-anchor", "start"); svg_hist.append("g") .call(yAxis) .attr("transform", `translate(${dimensions.margin},0)`) .select(".domain").remove(); let rects = svg_hist.append("g") .selectAll("g") .data(stack) .enter() .append("g") .attr("fill", (d, i) => colorCat[i]); rects.selectAll("rect") .data(d => d) .join("rect") .attr("x", (d, i) => xScale(d.data.age)) .attr("y", d => yScale(d[1])) .attr("height", d => yScale(d[0]) - yScale(d[1])) .attr("width", xScale.bandwidth()); svg_hist.append("g") .append("text") .attr("class","chart-title") .attr("transform", `translate(${dimensions.margin / 2}, ${dimensions.margin / 2})`) .text(title); let legend = svg_hist.append("g") .attr("class", "legend") .attr("transform", `translate(${dimensions.width - dimensions.margin}, ${dimensions.margin / 2})`); legend.selectAll("g.legend-square") .data(Object.keys(colorCat)) .enter() .append("rect") .attr("y", (d, i) => i * 25) .attr("width", 12) .attr("height", 12) .attr("fill", (d, i) => colorCat[i]); legend.selectAll("g.legend-text") .data(["Female", "Male", "Transgender"]) .enter() .append("text") .attr("dy", "0.7em") .attr("dx", "-0.5em") .attr("y", (d, i) => i * 25) .attr("text-anchor", "end") .text(d => d); return svg_hist.node(); }32:T99c,stack_gauge = function(data, title, style) { const dimensions = { width: width, height: style.height, margin: style.margin } let stack = d3.stack().keys(Object.keys(data))([data]); let colorScale = d3.scaleSequential(d3.interpolateYlOrRd) .domain([0, stack.length]) let colorFew = d3.schemeYlOrRd[stack.length > 2 ? stack.length : 3]; let colorMany = d3.range(0, stack.length).map(d => colorScale(d)); let color = stack.length < 10 ? colorFew : colorMany; const svg_gauge = d3.create("svg") .attr("viewBox", [0, 0, dimensions.width, dimensions.height]); const tooltip = d3.select("body").append("div") .attr("class", "svg-tooltip") .style("position", "absolute") .style("visibility", "hidden") .style("font-size", "1rem") .style("background", "rgba(0,0,0,0.5)") .style("padding", "0.1rem 0.5rem") .style("color", "#FFF") .style("border-radius", "3px"); let xScale = d3.scaleLinear() .domain([0, d3.max(stack, d => d3.max(d, d=> d[1]))]).nice() .range([dimensions.margin, dimensions.width - dimensions.margin]) let mouseover = (d) => { tooltip.style("visibility", "visible").text(d.key + ' (' + (d[0][1] - d[0][0]) + ')'); } let mouseoverRect = function (d) { d3.select(this).attr("opacity", 0.5); } let mouseoutRect = function (d) { d3.select(this).attr("opacity", 1); } let mousemove = () => tooltip .style("top", (d3.event.pageY+20)+"px") .style("left",(d3.event.pageX-50)+"px"); let mouseout = () => tooltip.style("visibility", "hidden"); let rects = svg_gauge.append("g") .selectAll("g") .data(stack) .enter() .append("g") .attr("class", "rect-container") .attr("data-name", d => d.key) .attr("fill", (d, i) => color[i]) .on("mouseover", mouseover) .on("mousemove", mousemove) .on("mouseout", mouseout); rects.selectAll("rect") .data(d => d) .join("rect") .attr("x", d => xScale(d[0])) .attr("y", dimensions.height / 2 - dimensions.margin / 2) .attr("height", 40) .attr("width", d => xScale(d[1]) - xScale(d[0])) .on("mouseover", mouseoverRect) .on("mouseout", mouseoutRect); svg_gauge.append("g") .append("text") .attr("class","chart-title") .attr("transform", `translate(${dimensions.margin}, ${dimensions.margin})`) .text(title); return svg_gauge.node(); }33:Ta4e,function stack_bubble(data, title, style) { const dimension = { height: 500, width: 800, margin: 50 } let opacityScale = d3.scaleLog() .domain([d3.min(data, d => d.value), d3.max(data, d => d.value)]) .range([1, 0.15]) let radiusScale = d3.scaleSqrt() .domain([d3.min(data, d => d.value), d3.max(data, d => d.value)]).nice() .range([1, (dimension.height - 3 * dimension.margin) / 2]) const svg_bubble = d3.create("svg").attr("viewBox", [0, 0, dimension.width, dimension.height]) const tooltip = d3.select("body").append("div") .attr("class", "svg-tooltip") .style("position", "absolute") .style("visibility", "hidden") .style("font-size", "1rem") .style("background", "rgba(255,255,255,0.8)") .style("padding", "0.1rem 0.5rem") .style("color", "#922D50") .style("border-radius", "3px") .style("border", "1px solid #922D50"); let mouseover = function (d) { tooltip.style("visibility", "visible").text(d.name + " - " + d.value); } let mousemove = () => tooltip .style("top", (d3.event.pageY-10)+"px") .style("left",(d3.event.pageX+20)+"px"); let mouseout = () => tooltip.style("visibility", "hidden"); svg_bubble .append("g") .selectAll("circle") .data(data) .enter() .append("circle") .attr("cx", (dimension.width - dimension.margin) / 2 + (dimension.width - dimension.margin) / 4) .attr("cy", d => (dimension.height - dimension.margin) - (radiusScale(d.value))) .attr("r", d => radiusScale(d.value)) .attr("fill", style.circle_fill) .attr("stroke", style.circle_stroke) .attr("stroke-width", style.circle_stroke_width) .attr("fill-opacity", d => opacityScale(d.value)); svg_bubble .append("g") .selectAll("circle") .data(data) .enter() .append("circle") .attr("cx", (dimension.width - dimension.margin) / 4) .attr("cy", d => (dimension.height - dimension.margin) - (radiusScale(d.value))) .attr("r", d => radiusScale(d.value)) .attr("fill", style.circle_fill) .attr("stroke", style.circle_stroke) .attr("stroke-width", style.circle_stroke_width) .attr("fill-opacity", d => opacityScale(d.value)); if (style.mouseover) svg_bubble.selectAll("circle") .on("mouseover", mouseover) .on("mousemove", mousemove) .on("mouseout", mouseout); svg_bubble.append("g") .append("text") .attr("class","chart-title") .attr("transform", `translate(${dimension.margin / 2}, ${dimension.margin / 2})`) .text(title); return svg_bubble.node(); }34:Tb17,calendar_view = (dataset, feature, calendarType, setWidth, setCellSize, color = false) => { let formatDay = d => "SMTWTFS"[d.getUTCDay()]; let formatDate = d3.utcFormat("%x"); let formatMonth = d3.utcFormat("%b"); const timeWeek = calendarType === "sunday" ? d3.utcSunday : d3.utcMonday const countDay = calendarType === "sunday" ? d => d.getUTCDay() : d => (d.getUTCDay() + 6) % 7 if(color == false) { color = d3.scaleSequential(d3.interpolateYlOrRd) .domain([0, d3.max(dataset, d => d[feature])]) } function pathMonth(t) { const n = calendarType === "weekday" ? 5 : 7; const d = Math.max(0, Math.min(n, countDay(t))); const w = timeWeek.count(d3.utcYear(t), t); return `${d === 0 ? `M${w * setCellSize},0` : d === n ? `M${(w + 1) * setCellSize},0` : `M${(w + 1) * setCellSize},0V${d * setCellSize}H${w * setCellSize}`}V${n * setCellSize}`; } const height = setCellSize * (calendarType === "weekday" ? 7 : 9) const years = d3.nest() .key(d => d.date.getUTCFullYear()) .entries(dataset) .reverse(); const svg = d3.select(DOM.svg(setWidth, height * years.length)) .style("font", "10px sans-serif") .style("width", width) .style("height", height * years.length); const year = svg.selectAll("g") .data(years) .join("g") .attr("transform", (d, i) => `translate(40,${height * i + 17 * 1.5})`); year.append("text") .attr("x", -5) .attr("y", -5) .attr("font-weight", "bold") .attr("text-anchor", "end") .text(d => d.key); year.append("g") .attr("text-anchor", "end") .selectAll("text") .data((calendarType === "weekday" ? d3.range(2, 7) : d3.range(7)).map(i => new Date(1995, 0, i))) .join("text") .attr("x", -5) .attr("y", d => (countDay(d) + 0.5) * 17) .attr("dy", "0.31em") .text(formatDay); year.append("g") .selectAll("rect") .data(d => d.values) .join("rect") .attr("width", setCellSize - 1) .attr("height", setCellSize - 1) .attr("x", d => timeWeek.count(d3.utcYear(d.date), d.date) * setCellSize + 0.5) .attr("y", d => countDay(d.date) * setCellSize + 0.5) .attr("fill", d => color(d[feature])) .append("title") .text(d => `${formatDate(d.date)}: ${d[feature]}`); const month = year.append("g") .selectAll("g") .data(d => d3.utcMonths(d3.utcMonth(d.values[0].date), d.values[d.values.length - 1].date)) .join("g"); month.filter((d, i) => i).append("path") .attr("fill", "none") .attr("stroke", "#fff") .attr("stroke-width", 3) .attr("d", pathMonth); month.append("text") .attr("x", d => timeWeek.count(d3.utcYear(d), timeWeek.ceil(d)) * setCellSize + 2) .attr("y", -5) .text(formatMonth); return svg.node(); }35:T108e,heat_map = function(data, title, style) { const dimension = { width: width, height: style.height, margin: 50 } let calculated_dim = function (h, w) { } const svg_heatmap = d3.create("svg").attr("viewBox", [0, 0, dimension.width, dimension.height]) .style("background", "#FFF") let b = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]; let xScale = d3.scaleBand() .domain(b) .range([0, (dimension.width - dimension.margin) * 0.7]) let yScale = d3.scaleBand() .domain(d3.range(0, 24)) .range([(dimension.height - dimension.margin) * 0.7, dimension.margin]) let summarizeData = function(data, col) { return [...d3.rollup(data, v => d3.sum(v, v => v.z), d => d[col])].map(d => ({ x: d[0], y: d[1] })) } let day_bars = summarizeData(data, 'x'); let hour_bars = summarizeData(data, 'y'); let yScaleBar = d3.scaleLinear() .domain([0, d3.max(day_bars, d => d.y)]).nice() .range([0, (dimension.height - dimension.margin) * 0.3]) let xScaleBar = d3.scaleLinear() .domain([0, d3.max(hour_bars, d => d.y)]).nice() .range([0, (dimension.width - dimension.margin) * 0.3]) let color = d3.interpolateYlOrRd; let zScale = d3.scaleLinear() .domain([0, d3.max(data, d => d.z)]) .range([0, 1]); let zScaleDay = d3.scaleLinear() .domain([d3.min(day_bars, d => d.y), d3.max(day_bars, d => d.y)]) .range([0.5, 1]); let zScaleHour = d3.scaleLinear() .domain([d3.min(hour_bars, d => d.y), d3.max(hour_bars, d => d.y)]) .range([0.10, 1]); let xAxis = d3.axisBottom() .scale(xScale) .tickSize(0) let yAxis = d3.axisRight() .scale(yScale) .tickSize(0) let yAxisBar = d3.axisRight() .scale(yScaleBar) .tickSize(0) let xAxisBar = d3.axisBottom() .scale(xScaleBar) .tickSize(0) svg_heatmap.append('g') .attr('transform', `translate(0, ${(dimension.height - dimension.margin) * 0.7})`) .call(xAxis) .selectAll("text") .attr("y", 0) .attr("x", 9) .attr("dy", ".35em") .attr("transform", "rotate(90)") .style("text-anchor", "start"); svg_heatmap.append('g') .attr('transform', `translate(${dimension.width * 0.7}, ${(dimension.height - dimension.margin) * 0.7})`) .call(xAxisBar) .selectAll("text") .attr("y", 0) .attr("x", 9) .attr("dy", ".35em") .attr("transform", "rotate(90)") .style("text-anchor", "start"); svg_heatmap.append('g') .attr('transform', `translate(${(dimension.width - dimension.margin) * 0.7}, 0)`) .call(yAxis); svg_heatmap.append('g') .attr('transform', `translate(${(dimension.width - dimension.margin) * 0.7}, ${(dimension.height) * 0.7})`) .call(yAxisBar); svg_heatmap .selectAll(".domain") .remove(); svg_heatmap.append("g") .selectAll("rect") .data(data) .enter() .append("rect") .attr("x", d => xScale(d.x) + xScale.bandwidth() / 4) .attr("y", d => yScale(d.y)) .attr("height", yScale.bandwidth()) .attr("width", xScale.bandwidth() / 2) .attr("fill", d => color(zScale(d.z))) .attr("fill-opacity", 1); svg_heatmap.append("g") .attr("class", "day-bar") .selectAll("rect") .data(day_bars) .enter() .append("rect") .attr("x", d => xScale(d.x) + xScale.bandwidth() / 4) .attr("y", d => dimension.height*0.7) .attr("height", d => yScaleBar(d.y)) .attr("width", xScale.bandwidth() / 2) .attr("fill", d => color(zScaleDay(d.y))) .attr("fill-opacity", 1); svg_heatmap.append("g") .attr("class", "hour-bar") .selectAll("rect") .data(hour_bars) .enter() .append("rect") .attr("x", d => dimension.width * 0.7) .attr("y", d => yScale(d.x)) .attr("height", d => yScale.bandwidth()) .attr("width", d => xScaleBar(d.y)) .attr("fill", d => color(zScaleHour(d.y))) .attr("fill-opacity", 1); svg_heatmap.append("g") .append("text") .attr("class","chart-title") .attr("transform", `translate(${dimension.margin / 2}, ${dimension.margin / 2})`) .text(title); return svg_heatmap.node() }36:T573,function basic_line (data, title, style) { const dimension = { width: width, height: style.height, margin: style.margin } const svg_plot = d3.create("svg") .attr("viewBox", [0, 0, dimension.width, dimension.height]) let xScale = d3.scaleTime() .domain([d3.min(data, d => new Date(d.x)), d3.max(data, d => new Date(d.x))]) .range([dimension.margin, dimension.width - dimension.margin]) let yScale = d3.scaleLinear() .domain(d3.extent(data, d => d.y)).nice() .range([dimension.height - dimension.margin, dimension.margin]) let xAxis = d3.axisBottom() .scale(xScale) let yAxis = d3.axisLeft() .scale(yScale) svg_plot.append('g') .attr('transform', `translate(0, ${dimension.height - dimension.margin})`) .call(xAxis); svg_plot.append('g') .attr('transform', `translate(${dimension.margin}, 0)`) .call(yAxis); let line = d3.line() .curve(d3.curveNatural) .x(d => xScale(new Date(d.x))) .y(d => yScale(d.y)); svg_plot.append('path') .attr("d", line(data)) .attr("stroke", style.stroke) .attr("stroke-width", style.stroke_width) .attr("fill-opacity", 0); svg_plot.append("g") .append("text") .attr("class","chart-title") .attr("transform", `translate(${dimension.margin / 2}, ${dimension.margin / 2})`) .text(title); return svg_plot.node(); }37:T5b7,function basic_plot (data, title, style) { const dimension = { width: width, height: style.height, margin: style.margin } const svg_plot = d3.create("svg") .attr("viewBox", [0, 0, dimension.width, dimension.height]) let xScale = d3.scaleLinear() .domain([0, d3.max(data, d => d.x)]).nice() .range([dimension.margin, dimension.width - dimension.margin]) let yScale = d3.scaleLinear() .domain([d3.min(data, d => d.y), d3.max(data, d => d.y)]).nice() .range([dimension.height - dimension.margin, dimension.margin]) let xAxis = d3.axisBottom() .scale(xScale) let yAxis = d3.axisLeft() .scale(yScale) svg_plot.append('g') .attr('transform', `translate(0, ${dimension.height - dimension.margin})`) .call(xAxis); svg_plot.append('g') .attr('transform', `translate(${dimension.margin}, 0)`) .call(yAxis); svg_plot.append("g") .selectAll("circle") .data(data) .enter() .append("circle") .attr("cx", d => xScale(d.x)) .attr("cy", d => yScale(d.y)) .attr("r", style.radius) .attr("fill", style.fill) .attr("fill-opacity", style.opacity) .attr("stroke", style.fill) .attr("stroke-width", 1); svg_plot.append("g") .append("text") .attr("class","chart-title") .attr("transform", `translate(${dimension.margin / 2}, ${dimension.margin / 2})`) .text(title); return svg_plot.node(); }38:[{"id":"a6c5765e9224ec1bd195793cc0612ee8cce829e0df0bcfe709df57cda41b052b7cfa6ecb73e53e1020f880893bca65c5a839961f969c24a10a9c31ecc075e5d4","href":"https://static.observableusercontent.com/files/a6c5765e9224ec1bd195793cc0612ee8cce829e0df0bcfe709df57cda41b052b7cfa6ecb73e53e1020f880893bca65c5a839961f969c24a10a9c31ecc075e5d4","name":"caba_weather.csv","type":"text/csv","lastModified":1581272255543.99,"size":79850},{"id":"a3d62490fbe33380144e75bc1c0f0ddb684fc700ea1fe45670e0fd43355ed886380a68d70a661e44b723cc54f35ae9d359eb98f3b3d52ce0831f8074b4af91db","href":"https://static.observableusercontent.com/files/a3d62490fbe33380144e75bc1c0f0ddb684fc700ea1fe45670e0fd43355ed886380a68d70a661e44b723cc54f35ae9d359eb98f3b3d52ce0831f8074b4af91db","name":"intervenciones-domiciliarias-abuso-sexual-2019-trimestre-4.csv","type":"text/csv","lastModified":1580184368388.295,"size":125255},{"id":"d1990127fa4fb3641e0689d45b1b1f8c42678a2dc754f1e94abf82ce8ba738ea64c44b205abff64357aa4357e18b37f179931bf38442b6cb3124aeee1a692427","href":"https://static.observableusercontent.com/files/d1990127fa4fb3641e0689d45b1b1f8c42678a2dc754f1e94abf82ce8ba738ea64c44b205abff64357aa4357e18b37f179931bf38442b6cb3124aeee1a692427","name":"intervenciones-domiciliarias-abuso-sexual-2019-trimestre-3.csv","type":"text/csv","lastModified":1580184368397.551,"size":108844},{"id":"39934a885f1800f6fd79ddc108f74176955e91f368db664123084ad69dce2df9eff051e80dc0c5bc3c016c4513e637ffd391230459d76e30cf0a3c5ed58f2dca","href":"https://static.observableusercontent.com/files/39934a885f1800f6fd79ddc108f74176955e91f368db664123084ad69dce2df9eff051e80dc0c5bc3c016c4513e637ffd391230459d76e30cf0a3c5ed58f2dca","name":"intervenciones-domiciliarias-abuso-sexual-2019-trimestre-2.csv","type":"text/csv","lastModified":1580184367779.497,"size":106666},{"id":"006a391721c0c243ee9c78d8a5b3265c382ce7f5c7358dc2fe13ea4024a097960688a2ec95397cc237d09fbc3e8d5c0b7bed5824b3e3aa5e4ab0cc7b5275ffe7","href":"https://static.observableusercontent.com/files/006a391721c0c243ee9c78d8a5b3265c382ce7f5c7358dc2fe13ea4024a097960688a2ec95397cc237d09fbc3e8d5c0b7bed5824b3e3aa5e4ab0cc7b5275ffe7","name":"intervenciones-domiciliarias-abuso-sexual-2019-trimestre-1.csv","type":"text/csv","lastModified":1580184368262.819,"size":111025}] 2f:{"title":"But what was she wearing?","cells":[{"id":0,"value":"md`# _But what was she wearing?_`","pinned":false,"hidden":false,"mode":"ojs"},{"id":339,"value":"md`Frankly I'm rather afraid to opine on the subject.\n\nSeveral recent conversations with friends have been rather illuminating; there's irony and knowledge in understanding one's own ignorance. \n\nA friend sent the below video, wherein a news anchor asks a victim of sexual assault whether or not he \"should recommend to his daughter to take the subway while dressed _sexily_.\" Reformulated as it may have been, it was still ignorant.\n\nI hope it goes without saying that to suggest that a victim could avoid being assailed by changing their behavior or choice of clothing does nothing to solve the underlying problem or move society forward.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":347,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":372,"value":"md`Let's take a look at some data from last year, 2019. In particular, **domicile interventions in cases of sexual abuse here in Capital Federal (Buenos Aires)** (when law enforcement actually comes to your door to manage a situation and takes a report).`","pinned":false,"hidden":false,"mode":"ojs"},{"id":378,"value":"md`#### Notes:\n
\n_I. No, there is no data collected about how victims dress. Thank goodness. How would you even quantify this?_\n\n_II. Prepare yourself to see a lot of rectangles._\n\n_III. I know my charts often lack titles, legends, and mouseovers. These are no exception. Let's just say that everything I publish is a WIP._\n\n_IV. I'm not going to translate the raw data, so the labels will remain mostly in Spanish._`","pinned":false,"hidden":false,"mode":"ojs"},{"id":38,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":388,"value":"md`## Intervenciones Domiciliarias\n
`","pinned":false,"hidden":false,"mode":"ojs"},{"id":614,"value":"viewof max_age = slider({\n title: \"Age Upper Bound\",\n min: 20, \n max: 100, \n step: 1,\n value: 60\n});","pinned":false,"hidden":false,"mode":"ojs"},{"id":75,"value":"stacked_hist(age_gender_data, \"Interventions by Age\", {\n height: Math.ceil(width * screen.height / screen.width),\n margin: width * 0.05\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1021,"value":"md`Unsurprisingly, there's a huge disparity between men and women at all ages, but the disparity changes: men get relatively \"safer\" as they age past puberty. \n\nWe see that **${(male_minor_victims / male_victims).toFixed(2)*100}%** of male victims are minors (17 or below). Constrast that with **${(female_minor_victims / female_victims).toFixed(2)*100}%** of female victims who are minors. `","pinned":false,"hidden":false,"mode":"ojs"},{"id":1112,"value":"md`
\n#### Compositions\n>Hover a chart section for details.\n\n
`","pinned":false,"hidden":false,"mode":"ojs"},{"id":933,"value":"stack_gauge(gender_object, \"Gender\", {height: 75, margin: 15})","pinned":false,"hidden":false,"mode":"ojs"},{"id":705,"value":"stack_gauge(nationality_object, \"Nationality\", {height: 75, margin: 15})","pinned":false,"hidden":false,"mode":"ojs"},{"id":989,"value":"stack_gauge(convive_object, \"Lives with Aggressor\", {height: 75, margin: 15})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1835,"value":"stack_gauge(vinculo_object, \"Relationship of Aggressor\", {height: 75, margin: 15})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1614,"value":"md`I'm personally surprised to see that a small proportion of victims live with their aggressor(s).`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1116,"value":"md`
\n#### Timing\n
`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1634,"value":"fullscreen = {\n const link = html`Click for Fullscreen`;\n link.onclick = () => link.parentElement.nextElementSibling.requestFullscreen();\n return link;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1460,"value":"heat_map(heatmap_data, \"Interventions by Day of Week and Hour\", {\n height: Math.ceil(width * screen.height / screen.width)\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1875,"value":"md`This chart was fun to make, but I imagine it's relatively difficult to interpret.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1752,"value":"md`Nonetheless, something interesting: there's a band of concentration around \"commuting\" hours, or \"arriving home\" hours (18-20hs). As expected, some concentration around Friday and Saturday in the _madrugada_.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1731,"value":"md`Looking at the below calendar view, it doesn't appear that there's a strong pattern over the year - ie. data is not clustered during summer months, around holidays, etc. \n\n> _We might choose to interpret this as evidence that wearing less clothing (as one does during swelteringly hot December, January, and February) doesn't result in more incidents._`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1713,"value":"calendar_view(year, 'value', 'sunday', width, 17)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1889,"value":"md`However, let's pretend we are serious about following this hunch (which we can probably already rule out based on the lack of visible pattern above), what might we do? \n\nWe could go get some temperature data from the NOAA. Before we attempt a regression, let's take a look at average temperatures in the city over the same time period.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1934,"value":"basic_line(weather, \"Capital Federal (Aeroparque) Average Temperatures (C), 2019\", {\n height: 500, \n margin: 50,\n stroke: d3.schemeYlOrRd[6][3],\n stroke_width: 2\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2064,"value":"md`Yup, looks like subtropical weather!\n\nNow let's merge the two datasets (weather and interventions over the calendar year) and generate a scatter plot to see if there appears to be a relationship. Again, the assumption is that there isn't.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":2072,"value":"basic_plot(date_weather_interventions, \"Interventions vs. Average Daily Temperature\", {\n height: 500,\n margin: 40,\n radius: 4,\n fill: d3.schemeYlOrRd[6][4],\n opacity: 0.5\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2110,"value":"md`As expected, total crapshoot. I think we can safely say, even before running a regression, that there is little correlation between temperature and interventions in cases of sexual abuse. If we are willing to accept temperature as a proxy for how someone might dress (which in my mind isn't totally _unreasonable_), then we can answer the question posed in the introduction.\n\nThat's all for this one. Highly depressing data.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":946,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":894,"value":"md`### Chart Functions and Helpers`","pinned":false,"hidden":false,"mode":"ojs"},{"id":59,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":701,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":182,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":1655,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":1450,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":1931,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"},{"id":2070,"value":"$37","pinned":false,"hidden":false,"mode":"ojs"},{"id":688,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1059,"value":"md`### Variables`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1007,"value":"male_victims = interventions.filter(d => d.victima_genero == 'Masculino').length","pinned":false,"hidden":false,"mode":"ojs"},{"id":1012,"value":"male_minor_victims = interventions.filter(d => d.victima_genero == 'Masculino' && d.victima_edad < 18).length","pinned":false,"hidden":false,"mode":"ojs"},{"id":1031,"value":"female_victims = interventions.filter(d => d.victima_genero == 'Femenino').length","pinned":false,"hidden":false,"mode":"ojs"},{"id":1039,"value":"female_minor_victims = interventions.filter(d => d.victima_genero == 'Femenino' && d.victima_edad < 18).length","pinned":false,"hidden":false,"mode":"ojs"},{"id":1062,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":873,"value":"md`### Data`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1871,"value":"md`Todo: manipulate \"raw\" data inside of chart functions?`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1906,"value":"weather_file = FileAttachment(\"caba_weather.csv\");","pinned":false,"hidden":false,"mode":"ojs"},{"id":1909,"value":"weather = [...d3.rollup(d3.csvParse(await weather_file.text()).filter(d => d.STATION == \"ARM00087582\"), v => +d3.mean(v, v => v.TAVG), d => d.DATE)].map(d => ({\n x: d[0],\n y: d[1]\n}))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1956,"value":"date_weather_interventions = {\n \n // It's very clear to me that I don't know the _right_ way to do this.\n \n var left = year.map(function (d) {\n var dt_str = [d.date.getUTCFullYear(), d.date.getUTCMonth()+1, d.date.getUTCDate()].join('-')\n return {date: dt_str, val_int: d.value};\n });\n \n var right = new Map();\n \n weather.map(function (d) {\n var q = new Date(Date.parse(d.x));\n var dt_str = [q.getUTCFullYear(), q.getUTCMonth()+1, q.getUTCDate()].join('-')\n right[dt_str] = d.y;\n });\n \n \n var joined = left.map(function (d) {\n d.y = right[d.date];\n d.x = d.val_int;\n d.date = new Date(d.date)\n return d;\n });\n \n return joined.filter(d => d.y != undefined);\n \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"interventions_files = [\n { file: FileAttachment(\"intervenciones-domiciliarias-abuso-sexual-2019-trimestre-1.csv\") },\n { file: FileAttachment(\"intervenciones-domiciliarias-abuso-sexual-2019-trimestre-2.csv\") },\n { file: FileAttachment(\"intervenciones-domiciliarias-abuso-sexual-2019-trimestre-3.csv\") },\n { file: FileAttachment(\"intervenciones-domiciliarias-abuso-sexual-2019-trimestre-4.csv\") },\n]","pinned":false,"hidden":false,"mode":"ojs"},{"id":23,"value":"interventions = {\n var temp = [];\n for (const promise of interventions_files.map(f => f))\n temp.push(d3.csvParse(await promise.file.text()));\n return d3.merge(temp);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":405,"value":"age_gender_data = [...d3.rollup(interventions, v => v.length, d => d.victima_edad, d => d.victima_genero)].map(dd => {\n var m = dd[1];\n return {\n age: +dd[0],\n female: +m.get('Femenino') || 0,\n male: +m.get('Masculino') || 0,\n trans: +m.get('Trans') || 0\n }\n}).filter(d => d.age <= max_age)\n .sort((a,b) => d3.ascending(a.age, b.age))","pinned":false,"hidden":false,"mode":"ojs"},{"id":691,"value":"nationality_array = \n[...d3.rollup(interventions, v => v.length, d => d.victima_nacionalidad)]\n .sort((a,b) => d3.descending(a[1], b[1]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":778,"value":"nationality_object = nationality_array.reduce((a, d) => {\n a[d[0]] = d[1]; return a;\n}, {})","pinned":false,"hidden":false,"mode":"ojs"},{"id":914,"value":"gender_array = \n [...d3.rollup(interventions, v => v.length, d => d.victima_genero)]\n .sort((a,b) => d3.descending(a[1], b[1]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":917,"value":"gender_object = gender_array.reduce((a, d) => {\n a[d[0]] = d[1]; return a; \n}, {})","pinned":false,"hidden":false,"mode":"ojs"},{"id":956,"value":"convive_array = \n [...d3.rollup(interventions, v => v.length, d => d.victima_convive_agresor)].map(d => ({\n quantity: d[1],\n key: d[0] == \"NO\" ? 0 : 1\n })).sort((a,b) => d3.descending(a[1], b[1]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":976,"value":"convive_object = ({\n 'Yes' : convive_array[1]['quantity'],\n 'No' : convive_array[0]['quantity']\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1126,"value":"dates = interventions.map(function(d) {\n var h = new Date(d.intervencion_fecha_hora);\n return {\n raw: h,\n month: h.getMonth(), \n day: h.getDate(),\n hour: h.getHours(),\n day_of_week: [\"Sun\", \"Mon\", \"Tue\", \"Wed\", \"Thu\", \"Fri\", \"Sat\"][h.getDay()]\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1486,"value":"heatmap_data = d3.merge([...d3.groups(dates, d => d.day_of_week, d => d.hour)].map(function (d) {\n var temp = d[1].map(function (h) {\n return {\n x: d[0],\n y: h[0],\n z: h[1].length\n } \n })\n return temp;\n}))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1660,"value":"year = [...d3.rollup(\n dates.map(d => [d.raw.getFullYear(), d.raw.getMonth()+1, d.raw.getDate()].join('-')), v => v.length, d => d)].map(d => ({\n date: new Date(d[0]),\n value: d[1]\n }))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1069,"value":"vinculo_clean = \n [...d3.group(interventions, d => d.victima_vinculo_agresor)].map(function (d) {\n var vinculo = d[0].split('|').length == 1 ? d[0] : d[0].split('|').length + ' attackers';\n return { relationship: vinculo.toString(), value: d[1].length };\n }).sort((a,b) => d3.descending(a[1], b[1]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1801,"value":"vinculo_array = [...d3.rollup(vinculo_clean, v => d3.sum(v, v => v.value), d => d.relationship)].map(d => ({\n relationship: d[0],\n value: d[1]\n})).sort((a, b) => d3.descending(a.value, b.value))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1825,"value":"vinculo_object = {\n var temp = {};\n vinculo_array.map(d => temp[d.relationship] = d.value)\n return temp;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":943,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"md`### Libraries`","pinned":false,"hidden":false,"mode":"ojs"},{"id":11,"value":"d3 = require('d3@5', 'd3-array@^2.2')","pinned":false,"hidden":false,"mode":"ojs"},{"id":610,"value":"import { slider } from \"@jashkenas/inputs\";","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W38","stdlib":"1","titling":"auto"}