25:["$","title",null,{"children":"Emergency Response: Geographical & Temporal Analysis | Toby Zhu | Observable"}] 49:T10d0,linked_and_coordinated_views = { let choice = 'incident_resp' if (map_entry === 'Incident count') { choice = 'incident_cnt' } else if (map_entry === 'Incident frequency') { choice = 'incident_frq' } let svg = d3.create('svg') .attr('width', width) .attr('height', height+bar_height + 2*margins.bottom) let g = svg.append('g') .attr('transform', `translate(${margins.left},${margins.top})`) let map_g = g.append('g') .attr('transform', `translate(0,${bar_height + 2*margins.bottom})`) let time_series_g = g.append('g') .attr('transform', `translate(${margins.left/3},${margins.plot_space_vertical/1.5+map_height+bar_height + 2*margins.bottom})`) g.append('line') .attr('y1', -20).attr('y2', bar_height+margins.bottom) .attr('x1', bar_width+margins.top).attr('x2', bar_width+margins.top) .attr('stroke', d3.hcl(0,0,80)) g.append('line') .attr('y1', bar_height + margins.bottom*1.3).attr('y2', bar_height + margins.bottom*1.3) .attr('x1', 0).attr('x2', width-(margins.left+margins.right)) .attr('stroke', d3.hcl(0,0,80)) g.append('line') .attr('y1', map_height+bar_height + 1.7*margins.bottom).attr('y2', map_height+bar_height + 1.7*margins.bottom) .attr('x1', 0).attr('x2', width-(margins.left+margins.right)) .attr('stroke', d3.hcl(0,0,80)) let week_g = g.append('g').attr('transform', `translate(26, 0)`) let income_g = g.append('g').attr('transform', `translate(${bar_width+2*margins.left},0)`) let pie_g = g.append('g').attr('transform', `translate(${bar_width/2*3},${bar_height/2+margins.top})`) if (week_or_month === 'Week') { draw_week(week_g, choice) } else { draw_month(week_g, choice) } show_bar_width(week_g, choice, null) if (demographic === 'Median household income') { draw_income(income_g, household_income, choice) show_bar_width(income_g, choice, choice) } else if (demographic === 'Median family income') { draw_income(income_g, family_income, choice) show_bar_width(income_g, choice, choice) } // format the axes g.selectAll('.yaxis').selectAll('path').remove() let tick_g = g.selectAll('.tick') tick_g.selectAll('line') .attr('stroke', d3.hcl(0,0,50)) tick_g.selectAll('text') .attr('fill', d3.hcl(0,0,50)) .attr('font-weight', 'bold') draw_map(map_g, choice) // draw the rectangle background time_series_g.append('rect') .attr('width', width) .attr('height', temporal_height) .attr('fill', d3.rgb(243,243,243)) if (time_series === 'Month') { draw_time_series2(time_series_g) } else { draw_time_series(time_series_g) } // add the title time_series_g.append('text') .attr('transform', `translate(${width/2}, ${-margins.top/3})`) .call(format_text, "Time series of incident count across different regions of Nashville, 2017-2021", '17px') let color = d3.scaleOrdinal().range(d3.schemeSet2) if (demographic === 'Ethnicity' || demographic === 'Gender') { let xxxx = null if (demographic === 'Gender') { xxxx = ['Male(25-29)', 'Female(25-29)'] draw_pie(pie_g, color, gender_dist[0], radius, gender_dist[1]) } else { xxxx = ethnicity_group draw_pie(pie_g, color, ethnicity_dist[0], radius, ethnicity_dist[1]) } let legend_scale = d3.scaleBand().domain(xxxx).range([0, bar_height/2]).padding(0.1) let legend_g = pie_g.append('g') .attr('transform', `translate(${bar_width/2-50},-80)`) .classed('legend_g', true) legend_g.selectAll() .data(xxxx) .join('rect') .attr('y', d => legend_scale(d)) .attr('width', 15) .attr('height', 15) .attr('fill', d => color(d)) legend_g.selectAll() .data(xxxx) .join('text') .attr('x', 20) .attr('y', d => legend_scale(d)+11) .call(format_text, d => d, '13px') .attr("text-anchor", "left") pie_g.append('text') .attr('transform', `translate(0, ${-bar_height/1.5+10})`) .call(format_text, "Demographic distribution at each tract, 2017-2021", '15px') } // link the views together via interaction state_hover_interaction(map_g, week_g, choice, week_or_month, pie_g, color) series_brush_interaction(map_g,time_series_g,choice) return svg.node() }4a:T951,draw_income = (income_g, datax, choice) => { if (choice === 'incident_resp') { let width_scale = d3.scaleLinear().domain([0, 500]).range([0, bar_width-margins.right]) income_g.selectAll() .data(datax) .join("rect") .attr("x", 0) .attr("y", d => income_scale(d[0])) .attr("width", d => width_scale(d[2])) .attr("height", income_scale.bandwidth() ) .attr("fill", d3.rgb(44, 152, 170)) // draw the x-axis income_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${bar_height})`) .call(d3.axisBottom(width_scale)) } else if (choice === 'incident_cnt') { let width_scale = d3.scaleLinear().domain([1000, 7000]).range([0, bar_width-margins.right]) income_g.selectAll() .data(datax) .join("rect") .attr("x", 0) .attr("y", d => income_scale(d[0])) .attr("width", d => width_scale(d[1])) .attr("height", income_scale.bandwidth() ) .attr("fill", d3.rgb(44, 152, 170)) income_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${bar_height})`) .call(d3.axisBottom(width_scale)) } else { income_g.selectAll() .data(datax) .join("rect") .attr("x", 0) .attr("y", d => income_scale(d[0])) .attr("width", d => income_incident_frq_scale(d[3])) .attr("height", income_scale.bandwidth() ) .attr("fill", d3.rgb(44, 152, 170)) income_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${bar_height})`) .call(d3.axisBottom(income_incident_frq_scale)) income_g.append('text') .attr('transform', `translate(${bar_width/2-20}, ${bar_height + margins.bottom})`) .call(format_text, 'Incident count per 1000 residents', '14px') } // draw the y-axis income_g.append('g') .classed('yaxis', true) .call(d3.axisLeft(income_scale).ticks(12)) if (choice !== 'incident_frq') { income_g.append('text') .attr('transform', `translate(${bar_width/2-20}, ${bar_height + margins.bottom})`) .call(format_text, map_entry, '14px') } // add the title income_g.append('text') .attr('transform', `translate(${bar_width/2-20}, ${-margins.top/3})`) .call(format_text, map_entry+" vs. "+ demographic+" across Nashville, 2017-2021", '15px') }4b:T7ef,draw_month = (month_g,choice) => { if (choice === 'incident_resp') { month_g.selectAll() .data(resp_month) .join("rect") .attr("x", 0) .attr("y", d => month12_scale(month[d.dates])) .attr("width", d => month_resp_scale(d[choice])) .attr("height", month12_scale.bandwidth() ) .attr("fill", "#69b3a2") // draw the x-axis month_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${bar_height})`) .call(d3.axisBottom(month_resp_scale)) } else if (choice === 'incident_cnt') { month_g.selectAll() .data(incident_month_only) .join("rect") .attr("x", 0) .attr("y", d => month12_scale(month[d.dates])) .attr("width", d => month12_incident_scale(d.incident_cnt)) .attr("height", month12_scale.bandwidth() ) .attr("fill", "#69b3a2") month_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${bar_height})`) .call(d3.axisBottom(month12_incident_scale)) } else { month_g.selectAll() .data(incident_month_frq) .join("rect") .attr("x", 0) .attr("y", d => month12_scale(month[d.dates])) .attr("width", (d,i) => month12_incident_frq_scale(d.incident_cnt)) .attr("height", month12_scale.bandwidth() ) .attr("fill", "#69b3a2") month_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${bar_height})`) .call(d3.axisBottom(month12_incident_frq_scale)) } // draw the y-axis month_g.append('g') .classed('yaxis', true) .call(d3.axisLeft(month12_scale).ticks(12)) month_g.append('text') .attr('transform', `translate(${bar_width/2-20}, ${bar_height + margins.bottom})`) .call(format_text, map_entry+" (month)", '14px') // add the title month_g.append('text') .attr('transform', `translate(${bar_width/2-20}, ${-margins.top/3})`) .call(format_text, map_entry+" across Nashville, 2017-2021", '15px') }4c:T5a9,draw_week = (week_g, choice) => { if (choice === 'incident_resp') { week_g.selectAll() .data(resp_week) .join("rect") .attr("x", 0) .attr("y", d => week_scale(week[d.dates])) .attr("width", d => week_resp_scale(d[choice])) .attr("height", week_scale.bandwidth() ) .attr("fill", "#69b3a2") week_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${bar_height})`) .call(d3.axisBottom(week_resp_scale)) } else { week_g.selectAll() .data(incident_week_only) .join("rect") .attr("x", 0) .attr("y", d => week_scale(week[d.dates])) .attr("width", d => week_incident_scale(d.incident_cnt)) .attr("height", week_scale.bandwidth() ) .attr("fill", "#69b3a2") week_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${bar_height})`) .call(d3.axisBottom(week_incident_scale)) } // draw the y-axis week_g.append('g') .classed('yaxis', true) .call(d3.axisLeft(week_scale).ticks(7)) week_g.append('text') .attr('transform', `translate(${bar_width/2-20}, ${bar_height + margins.bottom})`) .call(format_text, map_entry+" (day of week)", '14px') // add the title week_g.append('text') .attr('transform', `translate(${bar_width/2-20}, ${-margins.top/3})`) .call(format_text, map_entry+" across Nashville, 2017-2021", '15px') }4d:T1b13,state_hover_interaction = (map_g, week_g, choice, week_or_month, pie_g, color) => { // when hovering the mouse on a state map_g.selectAll('.area').on('mouseover', function(e,data_bind) { // highlight the state on the map d3.select(this).attr('stroke', d3.hcl(62,89,68)).attr('stroke-width', 4).raise() let meta = map_g.append('g') .classed('meta', true) .attr('transform', `translate(${width/7}, ${map_height/2-40})`) meta.append('text') .call(format_text, map_entry + ': '+ d3.select(this).attr('name'), '15px') meta.append('text') .attr('transform', `translate(0, ${20})`) .call(format_text, 'GEOID: '+data_bind.properties.GEOID, '15px') meta.append('text') .attr('transform', `translate(0, ${40})`) .call(format_text, 'COUNTYFP: '+data_bind.properties.COUNTYFP, '15px') meta.append('text') .attr('transform', `translate(0, ${60})`) .call(format_text, 'Median household income ($): '+data_bind.properties['median household income'], '15px') meta.append('text') .attr('transform', `translate(0, ${80})`) .call(format_text, 'Median family income ($): '+data_bind.properties['median family income'], '15px') pie_g.selectAll('.pie').remove() if (demographic === 'Ethnicity') { let datap = { White:data_bind.properties['white alone'], Black:data_bind.properties['black alone'], Native:data_bind.properties['native alone'], Asian:data_bind.properties['asian alone'], Hawaiin:data_bind.properties['hawaiin alone'], Hispanic:data_bind.properties['hispanic'], Others:data_bind.properties['other race alone'], Multiple:data_bind.properties['two or more races'] } draw_pie(pie_g, color, datap, radius, data_bind.properties['total population']) } else if (demographic === 'Gender') { let datap = { 'Male(25-29)':data_bind.properties['male 25 to 29'], 'Female(25-29)':data_bind.properties['female 25 to 29'] } draw_pie(pie_g, color, datap, radius, 1) } let new_data = davidson.features.filter(x => x.properties.GEOID === data_bind.properties.GEOID) let xx_g = week_g.append('g').classed('meta', true) if (choice === 'incident_resp') { if (week_or_month === 'Month') { let new_rect = d3.rollups(new_data, v => d3.mean(v, x => x.properties.response_time_sec), d => d.properties.time_utc.getMonth()) .filter(d => d[1]>=0) xx_g.selectAll() .data(new_rect) .join("rect") .attr("x", d => month12_incident_scale(0)) .attr("y", d => month12_scale(month[d[0]+1])+2) .attr("width", d => region_resp_scale(d[1])) .attr("height", month12_scale.bandwidth()-4) .attr("fill", d3.hcl(65,45,90)) xx_g.selectAll() .data(new_rect) .join("text") .attr('transform', d => `translate(${region_resp_scale(d[1])+5}, ${month12_scale(month[d[0]+1])+14})`) .call(format_text, d => Math.round(d[1]), '12px') .attr("fill", d3.hcl(0,0,0)) } else { let new_rect2 = d3.rollups(new_data, v => d3.mean(v, x => x.properties.response_time_sec), d => d.properties.day_of_week).filter(d => d[1]>=0) xx_g.selectAll() .data(new_rect2) .join("rect") .attr("x", d => week_incident_scale(0)) .attr("y", d => week_scale(week[d[0]])+3) .attr("width", d => region_resp_scale(d[1])) .attr("height", week_scale.bandwidth()-6) .attr("fill", d3.hcl(65,45,90)) xx_g.selectAll() .data(new_rect2) .join("text") .attr('transform', d => `translate(${region_resp_scale(d[1])+7}, ${week_scale(week[d[0]])+18})`) .call(format_text, d => Math.round(d[1]), '13px') .attr("fill", d3.hcl(0,0,0)) } } else { if (week_or_month === 'Month') { let new_rect = d3.rollups(new_data, v => v.length, d => d.properties.time_utc.getMonth()) if (choice === 'incident_cnt') { xx_g.selectAll() .data(new_rect) .join("rect") .attr("x", d => month12_incident_scale(0)) .attr("y", d => month12_scale(month[d[0]+1])+2) .attr("width", d => month12_incident_scale(d[1]*5)) .attr("height", month12_scale.bandwidth()-4) .attr("fill", d3.hcl(65,45,90)) xx_g.selectAll() .data(new_rect) .join("text") .attr('transform', d => `translate(${month12_incident_scale(d[1]*5)+5}, ${month12_scale(month[d[0]+1])+14})`) .call(format_text, d => d[1], '12px') .attr("fill", d3.hcl(0,0,0)) } else { xx_g.selectAll() .data(new_rect) .join("rect") .attr("x", d => month12_incident_scale(0)) .attr("y", d => month12_scale(month[d[0]+1])+2) .attr("width", (d,i) => month12_incident_scale(d[1]*18/month_cnt[i])) .attr("height", month12_scale.bandwidth()-4) .attr("fill", d3.hcl(65,45,90)) xx_g.selectAll() .data(new_rect) .join("text") .attr('transform', (d,i) => `translate(${month12_incident_scale(d[1]*18/month_cnt[i])+5}, ${month12_scale(month[d[0]+1])+14})`) .call(format_text, (d,i) => Math.round(d[1]/month_cnt[i]), '12px') .attr("fill", d3.hcl(0,0,0)) } } else { let new_rect2 = d3.rollups(new_data, v => v.length, d => d.properties.day_of_week) xx_g.selectAll() .data(new_rect2) .join("rect") .attr("x", d => week_incident_scale(0)) .attr("y", d => week_scale(week[d[0]])+3) .attr("width", d => week_incident_scale(d[1]*6)) .attr("height", week_scale.bandwidth()-6) .attr("fill", d3.hcl(65,45,90)) xx_g.selectAll() .data(new_rect2) .join("text") .attr('transform', d => `translate(${week_incident_scale(d[1]*6)+7}, ${week_scale(week[d[0]])+18})`) .call(format_text, d => d[1], '13px') .attr("fill", d3.hcl(0,0,0)) } } }) // when hovering out of a state map_g.selectAll('.area').on('mouseout', function(e,data_bind) { // revert map color display d3.select(this).attr('stroke', d3.hcl(0,0,30)).attr('stroke-width', 0.5).lower() // remove the line of this state on the line plot map_g.selectAll('.meta').remove() week_g.selectAll('.meta').remove() pie_g.selectAll('.pie').remove() if (demographic === 'Gender') { draw_pie(pie_g, color, gender_dist[0], radius, gender_dist[1]) } else if (demographic === 'Ethnicity') { draw_pie(pie_g, color, ethnicity_dist[0], radius, ethnicity_dist[1]) } }) }4e:T6c0,draw_time_series = (time_series_g) => { // draw the time as the x-axis time_series_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${temporal_height})`) .call(d3.axisBottom(time_scale)) // draw the precipitation as the y-axis time_series_g.append('g') .classed('yaxis', true) .call(d3.axisLeft(incident_scale).ticks(7)) // format the axes time_series_g.selectAll('path').remove() let tick_g = time_series_g.selectAll('.tick') tick_g.selectAll('line') .attr('stroke', d3.hcl(0,0,50)) tick_g.selectAll('text') .attr('fill', d3.hcl(0,0,50)) .attr('font-weight', 'bold') // add x axis grid lines time_series_g.select('.xaxis').selectAll('.tick') .append('line') .attr('y1', 0) .attr('y2', -temporal_height) .attr('stroke', d3.rgb(255, 255, 255)) .attr('stroke-width', 2) // add y axis grid lines time_series_g.select('.yaxis').selectAll('.tick') .append('line') .attr('x1', 0) .attr('x2', width) .attr('stroke', d3.rgb(255, 255, 255)) .attr('stroke-width', 2) // draw the time series time_series_g.selectAll() .data([first_incident, late_incident]) .join('path') .attr('lines',true) .attr('d', d => line_shape(d)) .attr('fill', 'none') .attr('stroke', d => d3.hcl(20,60,40)) .attr('stroke-width', 2) // add x, y labels time_series_g.append('text') .attr('transform', `translate(-${margins.left}, ${temporal_height/2}) rotate(270)`) .call(format_text, "Incident count", '16px') time_series_g.append('text') .attr('transform', `translate(${width/2}, ${temporal_height + margins.bottom})`) .call(format_text, "Time", '16px') }4f:T6e8,draw_time_series2 = (time_series_g) => { // draw the time as the x-axis time_series_g.append('g') .classed('xaxis', true) .attr('transform', `translate(0, ${temporal_height})`) .call(d3.axisBottom(month_scale).ticks(20)) // draw the precipitation as the y-axis time_series_g.append('g') .classed('yaxis', true) .call(d3.axisLeft(incident_month_scale).ticks(7)) // format the axes time_series_g.selectAll('path').remove() let tick_g = time_series_g.selectAll('.tick') tick_g.selectAll('line') .attr('stroke', d3.hcl(0,0,50)) tick_g.selectAll('text') .attr('fill', d3.hcl(0,0,50)) .attr('font-weight', 'bold') // add x axis grid lines time_series_g.select('.xaxis').selectAll('.tick') .append('line') .attr('y1', 0) .attr('y2', -temporal_height) .attr('stroke', d3.rgb(255, 255, 255)) .attr('stroke-width', 2) // add y axis grid lines time_series_g.select('.yaxis').selectAll('.tick') .append('line') .attr('x1', 0) .attr('x2', width) .attr('stroke', d3.rgb(255, 255, 255)) .attr('stroke-width', 2) // draw the time series time_series_g.selectAll() .data([first_incident_month, second_incident_month]) .join('path') .attr('lines',true) .attr('d', d => line_shape2(d)) .attr('fill', 'none') .attr('stroke', d => d3.hcl(135,25,70)) .attr('stroke-width', 3) // add x, y labels time_series_g.append('text') .attr('transform', `translate(-38, ${temporal_height/2}) rotate(270)`) .call(format_text, "Incident count per month", '16px') time_series_g.append('text') .attr('transform', `translate(${width/2}, ${temporal_height + margins.bottom})`) .call(format_text, "Time (month)", '16px') }50:T5c3,series_brush_interaction = (map_g,time_series_g,choice) => { // define the d3 brush let brush = d3.brushX().extent([[0, 0],[width, temporal_height]]) // when starting the brush brush.on('brush end', function(e) { // get the selected period let rect_select = e.selection if (rect_select === null) { map_g.selectAll('.area') .attr('fill', d => color_scale(d.properties[choice])) .attr('name', d => d.properties[choice]) return } let brushed_time = [time_scale.invert(rect_select[0]), time_scale.invert(rect_select[1])] let new_incidents = d3.rollups(davidson.features, v => v.filter(d => d.properties.time_utc >= brushed_time[0] && d.properties.time_utc <= brushed_time[1]), d => d.properties.GEOID ) let helper = new Map() if (choice === 'incident_cnt') { new_incidents.forEach(d => helper.set(d[0], d[1].length)) } else if (choice === 'incident_frq') { let time_span = Math.floor((brushed_time[1] - brushed_time[0])/86400000)+1 new_incidents.forEach(d => helper.set(d[0], d[1].length/time_span)) } else { new_incidents.forEach(d => helper.set(d[0], d3.mean(d[1], x => x.properties.response_time_sec)||0)) } // update the map color display map_g.selectAll('.area') .attr('fill', d => color_scale(helper.get(d.properties.GEOID))) .attr('name', d => helper.get(d.properties.GEOID)) }) time_series_g.call(brush) }51:T485,color_legend = (g, domain, x_range, y_translation, legend_height, color_mapping) => { let spatial_scale = d3.scaleLinear().domain(domain).range(x_range).nice() let the_axis = d3.axisBottom(spatial_scale).ticks(5) let proper_offset = y_translation+legend_height let legend_axis = g.append('g').attr('transform', `translate(0,${y_translation+legend_height})`).call(the_axis) legend_axis.selectAll('.tick').select('line').style('stroke', d3.hcl(0,0,52)) legend_axis.selectAll('.tick').select('text').style('fill', d3.hcl(0,0,52)) let n_ticks = 0 legend_axis.selectAll('.tick').each(_ => {n_ticks+=1}) legend_axis.select('.domain').remove() let tick_values = [] legend_axis.selectAll('.tick').each(d => { tick_values.push(d)}) g.append('defs').append('linearGradient').attr('id', 'cm') .selectAll('stop').data(tick_values).enter().append('stop') .attr('offset', (_,i) => (100*i/(tick_values.length-1))+'%') .attr('stop-color', d => color_mapping(d)) g.append('rect').attr('x', x_range[0]-1).attr('width', x_range[1]-x_range[0]+2) .attr('y', y_translation).attr('height', legend_height).style('fill', 'url(#cm)') }52:[] 29:{"id":"3b5add652fefaf87","slug":null,"title":"Emergency Response: Geographical & Temporal Analysis","thumbnail":"01a268ff298fcd6eb99ec6495d4123e9a1bd1e2eb3e15e4b97ba7be75d73c600","access_level":"public","create_time":"$D2023-05-02T01:42:33.905Z","update_time":"$D2023-05-02T01:42:33.905Z","view_time":null,"first_public_time":"$D2023-05-02T01:42:33.905Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"50ba3ab87865222e","login":"tobyzhu","name":"Toby Zhu","avatar_url":"https://avatars-next.observableusercontent.com/16f7991fbd592946eff73e262dbfa58c16e735759dd313d388c0cf2baa2b72b4","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":2048,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"a53831491c225e96","login":"tobyzhu","name":"Toby Zhu","avatar_url":"https://avatars-next.observableusercontent.com/16f7991fbd592946eff73e262dbfa58c16e735759dd313d388c0cf2baa2b72b4","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"a53831491c225e96","login":"tobyzhu","name":"Toby Zhu","avatar_url":"https://avatars-next.observableusercontent.com/16f7991fbd592946eff73e262dbfa58c16e735759dd313d388c0cf2baa2b72b4","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Emergency Response: Geographical & Temporal Analysis","cells":[{"id":1564,"value":"# Emergency Response: Geographical & Temporal Analysis","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":0,"value":"## Set Credentials for Amazon S3","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":9,"value":"viewof accessKeyId = secret('accessKeyId', {title: \"AWS Access Key ID\", submit: \"Set\", description: \"localStorage[\\\"accessKeyId\\\"]\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"viewof secretAccessKey = secret('secretAccessKey', {title: \"AWS Secret Access Key\", submit: \"Set\", description: \"localStorage[\\\"secretAccessKey\\\"]\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":43,"value":"viewof sessionToken = secret('sessionToken', {title: \"AWS Session Token\", submit: \"Set\", description: \"localStorage[\\\"sessionToken\\\"]\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"AWS.config.credentials = new AWS.Credentials(localStorage[\"accessKeyId\"], localStorage[\"secretAccessKey\"], localStorage['sessionToken'])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"auth_AWS = {\n AWS.config.credentials;\n AWS.config.region;\n return AWS;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":347,"value":"## Visualization","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1325,"value":"viewof week_or_month = Inputs.select(['Week','Month'], {label: \"Box plot time distribution (left)\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1445,"value":"viewof demographic = Inputs.select(['Median household income', 'Median family income', 'Ethnicity', 'Gender'], {label: \"Demographic choice (right)\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":553,"value":"viewof time_series = Inputs.select(['Exact time','Month'], {label: \"Time series granularity\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1013,"value":"viewof map_entry = Inputs.select(['Incident count', 'Incident frequency', 'Incident average response time (s)'], {label: \"Map color representation\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"$49","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":349,"value":"### Data preparation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1266,"value":"davidson = {\n let objectParams = ({\n Bucket: 'wwu-incidents',\n Key: 'incident_census_join_econ',\n Expires: 60*5\n })\n let data = await d3.json(s3.getSignedUrl('getObject', objectParams))\n data.features.forEach(d => d.properties.time_utc = new Date(d.properties.time_utc))\n return data\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":204,"value":"davidson_clean = d3.groups(davidson.features, d => d.properties.GEOID)\n .map(d => [d[1][0], d[1].length, d[1].length/all_days, d3.mean(d[1], x => x.properties.response_time_sec)])\n .map(d => {\n d[0].properties.incident_cnt = d[1]\n d[0].properties.incident_frq = d[2]\n d[0].properties.incident_resp = d[3]\n return d[0]\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":418,"value":"date_separate = new Date('2018-01-01')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":998,"value":"all_days = (time_domain[1]-time_domain[0])/86400000 + 1","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1318,"value":"incident_obj = ({\n Bucket: 'wwu-incidents',\n Key: 'nfd_incidents_xd_seg.parquet',\n Expires: 60*5\n});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":287,"value":"db = DuckDBClient.of({ \n incident: getRemoteFile(s3.getSignedUrl('getObject', incident_obj))\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":308,"value":"select CAST(strftime('%Y-%m-%d', time_utc) AS DATETIME) AS dates, CAST(COUNT(*) AS INT) AS incident_cnt \n FROM incident group by dates order by dates","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"incident_data","database":"var:db"},{"id":485,"value":"select CAST(CONCAT(strftime('%Y-%m', time_utc),'-01') AS DATETIME) AS dates, CAST(COUNT(*) AS INT) AS incident_cnt \n FROM incident group by dates order by dates","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"incident_month","database":"var:db"},{"id":681,"value":"select MONTH(time_utc) AS dates, CAST(COUNT(*) AS INT) AS incident_cnt FROM incident group by dates order by dates","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"incident_month_only","database":"var:db"},{"id":688,"value":"select day_of_week as dates, cast(count(*) as INT) as incident_cnt from incident group by dates order by dates","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"incident_week_only","database":"var:db"},{"id":1059,"value":"select MONTH(time_utc) as dates, AVG(response_time_sec) as incident_resp from incident group by dates order by dates","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"resp_month","database":"var:db"},{"id":1068,"value":"select day_of_week as dates, AVG(response_time_sec) as incident_resp from incident group by dates order by dates","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"resp_week","database":"var:db"},{"id":2027,"value":"month_cnt = d3.groups(incident_month, d => d.dates.getMonth()).map(d => d[1].length)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1993,"value":"incident_month_frq = {\n let re = []\n incident_month_only.forEach((d,i) => {\n let x = {dates:i+1, incident_cnt:Math.round(d.incident_cnt/month_cnt[i])}\n re.push(x)\n })\n return re\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1612,"value":"household_income_popu = d3.rollup(\n davidson_clean.map(x => [x.properties['median household income'], x.properties['total population']]),\n v => v.reduce((a,b) => a+b[1], 0),\n d => {\n if (d[0] < 30000) return '0-30k'\n else if (d[0] < 40000) return '30-40k'\n else if (d[0] < 50000) return '40-50k'\n else if (d[0] < 60000) return '50-60k'\n else if (d[0] < 70000) return '60-70k'\n else return '70k +'\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1628,"value":"family_income_popu = d3.rollup(\n davidson_clean.map(x => [x.properties['median family income'], x.properties['total population']]),\n v => v.reduce((a,b) => a+b[1], 0),\n d => {\n if (d[0] < 30000) return '0-30k'\n else if (d[0] < 40000) return '30-40k'\n else if (d[0] < 50000) return '40-50k'\n else if (d[0] < 60000) return '50-60k'\n else if (d[0] < 70000) return '60-70k'\n else return '70k +'\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1350,"value":"household_income = d3.groups(\n davidson.features.map(d => [d.properties['median household income'], d.properties['response_time_sec']]).filter(d => d[0]>0 && d[1]>0),\n x => {\n let d = x[0]\n if (d < 30000) return '0-30k'\n else if (d < 40000) return '30-40k'\n else if (d < 50000) return '40-50k'\n else if (d < 60000) return '50-60k'\n else if (d < 70000) return '60-70k'\n else return '70k +'\n }\n).map(d => [d[0], d[1].length, d3.mean(d[1].map(c => c[1])), d[1].length/household_income_popu.get(d[0])*1000]).sort()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1406,"value":"family_income = d3.groups(\n davidson.features.map(d => [d.properties['median family income'], d.properties['response_time_sec']]).filter(d => d[0]>0 && d[1]>0),\n x => {\n let d = x[0]\n if (d < 30000) return '0-30k'\n else if (d < 40000) return '30-40k'\n else if (d < 50000) return '40-50k'\n else if (d < 60000) return '50-60k'\n else if (d < 70000) return '60-70k'\n else return '70k +'\n }\n).map(d => [d[0], d[1].length, d3.mean(d[1].map(c => c[1])), d[1].length/family_income_popu.get(d[0])*1000]).sort()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1572,"value":"ethnicity_dist = {\n let result = davidson_clean.map(d => [\n d.properties['white alone'], \n d.properties['black alone'], \n d.properties['native alone'], \n d.properties['asian alone'], \n d.properties['hawaiin alone'],\n d.properties['hispanic'],\n d.properties['other race alone'],\n d.properties['two or more races'],\n d.properties['total population']\n ]).reduce((acc, cur) => acc.map((x,i) => x+cur[i]), [0,0,0,0,0,0,0,0,0])\n\n let dict = {}\n ethnicity_group.forEach((d,i) => dict[d] = result[i])\n return [dict, result[result.length-1]]\n} ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1593,"value":"gender_dist = {\n let result = davidson_clean.map(d => [d.properties['male 25 to 29'], d.properties['female 25 to 29']])\n .reduce((acc, cur) => acc.map((x,i) => x+cur[i]), [0,0])\n return [{'Male(25-29)':result[0], 'Female(25-29)':result[1]}, result[0]+result[1]]\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":410,"value":"first_incident = incident_data.filter(d => d.dates < date_separate)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":421,"value":"late_incident = incident_data.filter(d => d.dates >= date_separate)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":509,"value":"first_incident_month = incident_month.filter(d => d.dates < date_separate)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":534,"value":"second_incident_month = incident_month.filter(d => d.dates >= date_separate)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":351,"value":"### Parameters","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":66,"value":"margins = ({left:40, right:40, top:30, bottom:40, plot_space_horizontal:60, plot_space_vertical:40})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":68,"value":"height = 800","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"map_height = 450","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":72,"value":"temporal_height = 240","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":707,"value":"bar_width = 520","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":737,"value":"bar_height = 300","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1580,"value":"radius = Math.min(bar_width, bar_height) / 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":353,"value":"### Scales and domains","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":230,"value":"incident_domain = d3.extent(davidson_clean, d => d.properties.incident_cnt)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1020,"value":"incident_frq_domain = [0,2.5]//d3.extent(davidson_clean, d => d.properties.incident_frq)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1023,"value":"incident_resp_domain = d3.extent(davidson_clean, d => d.properties.incident_resp)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1029,"value":"choose_data_domain = {\n if (map_entry === 'Incident count') {\n return incident_domain\n } else if (map_entry === 'Incident frequency') {\n return incident_frq_domain\n } else {\n return incident_resp_domain\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":358,"value":"incident_time_domain = d3.extent(incident_data, d => d.incident_cnt)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":544,"value":"incident_month_domain = d3.extent(incident_month, d => d.incident_cnt)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":361,"value":"time_domain = d3.extent(incident_data, d => d.dates)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":548,"value":"month_domain = d3.extent(incident_month, d => d.dates)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":602,"value":"linear_scale = d3.scaleSequential().domain(choose_data_domain).range([102, 0])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":232,"value":"color_scale = input => d3.hcl(289, 34, linear_scale(input))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":364,"value":"incident_scale = d3.scaleLinear().domain(incident_time_domain).range([temporal_height, 0])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":557,"value":"incident_month_scale = d3.scaleLinear().domain(incident_month_domain).range([temporal_height, 0])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":366,"value":"time_scale = d3.scaleTime().domain(time_domain).range([0, width-margins.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":559,"value":"month_scale = d3.scaleTime().domain(month_domain).range([0, width-margins.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":710,"value":"week_scale = d3.scaleBand().domain(week).range([bar_height, 0]).padding(0.2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":745,"value":"week_incident_scale = d3.scaleLinear().domain([0, 5100]).range([0,bar_width-margins.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":719,"value":"month12_scale = d3.scaleBand().domain(month.slice(1)).range([bar_height, 0]).padding(0.2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":750,"value":"month12_incident_scale = d3.scaleLinear().domain([0, 3100]).range([0,bar_width])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2007,"value":"month12_incident_frq_scale = d3.scaleLinear().domain([0, 900]).range([0,bar_width-20])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1080,"value":"week_resp_scale = d3.scaleLinear().domain([280, 410]).range([0,bar_width-margins.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1083,"value":"month_resp_scale = d3.scaleLinear().domain([260, 410]).range([0,bar_width])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1100,"value":"region_resp_scale = d3.scaleLinear().domain([0, 1200]).range([0,bar_width/3*2])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1438,"value":"income_scale = d3.scaleBand().domain(household_income.map(d=>d[0])).range([bar_height, 0]).padding(0.2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1634,"value":"income_incident_frq_scale = d3.scaleLinear().domain([0,85]).range([0,bar_width])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1476,"value":"### Draw pie charts","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1474,"value":"draw_pie = (pie_g, color, datap, radius, total) => {\n let pie = d3.pie().value(function(d) {return d[1]})\n let data_ready = pie(Object.entries(datap))\n \n let arcGenerator = d3.arc().innerRadius(0).outerRadius(radius)\n \n pie_g.selectAll()\n .data(data_ready)\n .enter()\n .append('path')\n .classed('pie', true)\n .attr('d', arcGenerator)\n .attr('fill', d => color(d.data[0]))\n .attr(\"stroke\", \"black\")\n .style(\"stroke-width\", \"2px\")\n .style(\"opacity\", 0.7)\n\n if (demographic !== 'Gender') {\n pie_g.selectAll()\n .data(data_ready.filter(d => d.data[1]/total>=0.05))\n .enter()\n .append('text')\n .text(d => `${Math.round(d.data[1]/total*100)}%`)\n .classed('pie', true)\n .attr(\"transform\", function(d) { return \"translate(\" + arcGenerator.centroid(d) + \")\"; })\n .style(\"text-anchor\", \"middle\")\n .style(\"font-size\", 17)\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1415,"value":"### Draw demographic bar plots","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1417,"value":"$4a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1294,"value":"### Draw week/month bar plots","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":860,"value":"$4b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":856,"value":"$4c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":798,"value":"show_bar_width = (g,choice,income) => {\n if (income === null) {\n if (choice !== 'incident_resp') choice = 'incident_cnt'\n } else {\n if (income === 'incident_resp') {\n choice = 2\n } else if (income === 'incident_cnt') {\n choice = 1\n } else {\n choice = 3\n }\n }\n \n g.selectAll('rect').on('mouseover', function(e,data_bind) {\n g.append('text')\n .classed('note', true)\n .attr('x', d3.select(this).attr('width'))\n .attr('y', d3.select(this).attr('y'))\n .attr('transform', `translate(5,${d3.select(this).attr('height')/2})`)\n .call(format_text, Math.round(data_bind[choice]), '13px')\n })\n\n // when hovering out of a state\n g.selectAll('rect').on('mouseout', function(e,data_bind) {\n g.selectAll('.note').remove()\n })\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":368,"value":"### Draw Map","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":82,"value":"map_projection = d3.geoAlbers()\n .fitExtent([[0, 0],[width, map_height-20]],davidson)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":166,"value":"path = d3.geoPath().projection(map_projection)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":89,"value":"draw_map = (map_g, choice) => {\n let us_g = map_g.selectAll()\t\n .data(davidson_clean)\n .enter()\n .append('path')\n .classed('area', true)\n .attr('name', d => d.properties[choice])\n .attr(\"d\", (feature) => path(feature))\n .attr('fill', d => color_scale(d.properties[choice]))\n .attr('stroke', d3.hcl(0,0,30))\n .attr('stroke-width', 0.5)\n\n // add the legend\n color_legend(map_g, choose_data_domain, [margins.left, width/4], map_height - margins.plot_space_horizontal, 15, color_scale)\n\n // add the title\n map_g.append('text')\n .attr('transform', `translate(${width/2}, ${-margins.top/4})`)\n .call(format_text, 'Choropleth map of incidents in Davidson county', '17px')\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":270,"value":"$4d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":370,"value":"### Draw temporal plot","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":376,"value":"// define the line shape\nline_shape = d3.line()\n .x(d => time_scale(d.dates))\n .y(d => incident_scale(d.incident_cnt))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":372,"value":"$4e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":540,"value":"// define the line shape\nline_shape2 = d3.line()\n .x(d => month_scale(d.dates))\n .y(d => incident_month_scale(d.incident_cnt))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":538,"value":"$4f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":427,"value":"$50","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":268,"value":"### Helper Functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1258,"value":"function getRemoteFile(url) {\n const baseURL = new URL(url);\n return {\n file: {\n name: baseURL.pathname,\n url: function () {\n return url;\n }\n }\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":264,"value":"format_text = function(selection, texts, size) {\n selection.attr('text-anchor', 'middle')\n .attr('font-size', size)\n .attr('font-weight', 'bold')\n .attr('fill', d3.hcl(0,0,42))\n .text(texts)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":243,"value":"$51","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":712,"value":"week = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":721,"value":"month = ['null', 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1585,"value":"ethnicity_group = ['White','Black','Native','Asian','Hawaiin','Hispanic','Others','Multiple']","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1700,"value":"### Imports","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"import {secret} from \"@tmcw/secret\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":290,"value":"import { DuckDBClient } from \"@cmudig/duckdb\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"AWS = require('aws-sdk@2.794.0/dist/aws-sdk-react-native.js')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"s3 = new auth_AWS.S3({apiVersion: '2006-03-01'});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W52","stdlib":"1"}} 24:null