2e:null 2f:["$","title",null,{"children":"NYPD Complaints (1985-2020) | Nicholas Tahani | Observable"}] 34:Tbe7,viz = { const svg = d3.create('svg') .attr('viewBox', [0, 0, 1250, 650]) const barChartContainer = svg.append('g') .attr('transform', 'translate(80, 250)') svg.append('g') .attr('transform', 'translate(100, 60)') .append(() => legend({color, title: 'No. of Complaints'})); //create and fill map svg.append('g') .attr('transform', 'translate(200, 0)') .selectAll('path') .data(topojson.feature(ny, ny.objects.nypd_precincts).features) .join('path') .attr('class', 'precinct') .attr('fill', d => { const precinct = mappedPrecincts.get(d.properties.precinct) return precinct ? color(precinct) : 'url(#diagonalHatch)' }) .attr('d', path) .attr('stroke-width', 1) .attr('stroke', '#fff') //map interaction .on('mouseover', d => { const precinctData = precinctByYear.data[date][d.properties.precinct].ethnicities const xScale = d3.scaleBand() .domain(Object.keys(precinctData)) .rangeRound([40, 550]) .padding(0.1) const yScale = d3.scaleLinear() .domain([0, d3.max(Object.values(precinctData))]) .range([100, 0]) console.log(Object.entries(precinctData).map(d => d[1])) barChartContainer.selectAll('rect') .data(Object.entries(precinctData)) .join('rect') .attr('x', d => xScale(d[0])) .attr('y', d => yScale(d[1])) .attr('width', xScale.bandwidth()) .attr('height', d => yScale(0) - yScale(d[1])) .attr('fill', 'steelblue') barChartContainer.append('g') .attr('transform', `translate(${margin.left}, 0)`) .call(d3.axisLeft(yScale).ticks(5)) .call(g => g.select('.domain').remove()) barChartContainer.append('g') .attr('transform', `translate(0, ${height - margin.bottom - 370})`) .call(d3.axisBottom(xScale).tickSizeOuter(0)) barChartContainer.append('text') .attr('font-family', 'sans-serif') .attr('font-size', 10) .attr('y', 10) .text('Complaints') .attr('transform', 'translate(10,-20)') barChartContainer.append('g') .call(yScale) barChartContainer.append('g') .call(xScale) }) .on('mouseout', () => barChartContainer.selectAll('*').remove()) .append('title') .text(d => { const precinct = mappedPrecincts.get(d.properties.precinct) return precinct ? `${formatNames(d.properties.precinct)} ${formatCounts(precinct)}` : 'No Complaints' }) //outline precincts on hover svg .selectAll('.precinct') .on('mouseenter', function(d) { d3.select(this) .attr('stroke', '#000') .attr('stroke-width', 1.5) .raise() }) .on('mouseleave', function() { d3.select(this) .attr('stroke', '#fff') .attr('stroke-width', 1) .lower() }) return svg.node() }35:[{"id":"7c60e4d2893d6abcfc2c260b7a55d3f0272e65626c37e1cc268490c37ffedef93d320b44140f5e161b256efa9321b80a18589ce7a074c4b33c69baa68bf62268","href":"https://static.observableusercontent.com/files/7c60e4d2893d6abcfc2c260b7a55d3f0272e65626c37e1cc268490c37ffedef93d320b44140f5e161b256efa9321b80a18589ce7a074c4b33c69baa68bf62268","name":"ethnicites.json","type":"application/json","lastModified":1600385418406.401,"size":294957},{"id":"fbdd54d1934042394b125c48d73024ae56732b71ba99dd37a66fe4624812a8885dfb4893bbfee31568e34d207073d4856dd89f6372f24815bd7fb1b6d15cfceb","href":"https://static.observableusercontent.com/files/fbdd54d1934042394b125c48d73024ae56732b71ba99dd37a66fe4624812a8885dfb4893bbfee31568e34d207073d4856dd89f6372f24815bd7fb1b6d15cfceb","name":"counts_by_precinct.csv","type":"text/csv","lastModified":1600385735669.086,"size":672},{"id":"e96c780e114207ce4dfee0fff4112989dcd77473c55bfdc1bf9977c065267476149b3a3d8fb8e611a32eb4846a243c281c8e24ebf1ec91036a1dfa9360a1277c","href":"https://static.observableusercontent.com/files/e96c780e114207ce4dfee0fff4112989dcd77473c55bfdc1bf9977c065267476149b3a3d8fb8e611a32eb4846a243c281c8e24ebf1ec91036a1dfa9360a1277c","name":"ethnicityByYear.json","type":"application/json","lastModified":1600385425315.277,"size":329115},{"id":"b613b7cc552b4403df7cae1b2022a1495d6120c8429ea8ffb3c42e83ea63018476f24b937662f67b5f05d312f816afe486d091db613297ed94d1fe03e8d8c10e","href":"https://static.observableusercontent.com/files/b613b7cc552b4403df7cae1b2022a1495d6120c8429ea8ffb3c42e83ea63018476f24b937662f67b5f05d312f816afe486d091db613297ed94d1fe03e8d8c10e","name":"ethnicity_counts.json","type":"application/json","lastModified":1600385436118.504,"size":241629},{"id":"a7a429badf192ca00622cf1402c8533be46adf7f9fd90c34b6da8b081b0c7a4037e5bca7a337251b46b8aa06d323e7d9f84c4fe09891810ad0d50c6bc518d65c","href":"https://static.observableusercontent.com/files/a7a429badf192ca00622cf1402c8533be46adf7f9fd90c34b6da8b081b0c7a4037e5bca7a337251b46b8aa06d323e7d9f84c4fe09891810ad0d50c6bc518d65c","name":"allegations_202007271729.csv","type":"text/csv","lastModified":1600385491991.26,"size":9553201},{"id":"81f1d992c37e4e39e626b1c203e552972ec2065bd3be9e6a84760a92acdc9dc5e290543544c5886799498d250a2aff288dbd5c527b188b106405fa80ab55da6d","href":"https://static.observableusercontent.com/files/81f1d992c37e4e39e626b1c203e552972ec2065bd3be9e6a84760a92acdc9dc5e290543544c5886799498d250a2aff288dbd5c527b188b106405fa80ab55da6d","name":"nypd_precincts.json","type":"application/json","lastModified":1600385584456.521,"size":816719},{"id":"782e11cc827c03b9191c8ae06413e0f3de7bf7869f8a8e439370d0535546880d80e5862b1084e72219d709bc3877faefd9202445f2f3bc347dd5c41a75fcf5c5","href":"https://static.observableusercontent.com/files/782e11cc827c03b9191c8ae06413e0f3de7bf7869f8a8e439370d0535546880d80e5862b1084e72219d709bc3877faefd9202445f2f3bc347dd5c41a75fcf5c5","name":"nypd_allegations.csv","type":"text/csv","lastModified":1600385722031.343,"size":94695}] 32:{"id":"7111ccf617cfe2f1","slug":"nypd-complaints-1985-2020","title":"NYPD Complaints (1985-2020)","thumbnail":"168972af64a298d61be99f9ca642784030690cd1731b1425bb48b1f2d688e0a2","access_level":"public","create_time":"$D2020-09-17T23:22:21.536Z","update_time":"$D2024-08-01T07:29:44.193Z","view_time":null,"first_public_time":"$D2020-09-17T23:39:49.553Z","has_unpublished_edits":null,"fork":false,"stars":5,"starred":false,"owner":{"type":"team","id":"7cdadd6b49a8f3e0","login":"nicktahani","name":"Nicholas Tahani","avatar_url":"https://avatars-next.observableusercontent.com/189bd6428a8cf525288ae395fd50fe4a2bfd4252fba80403361960889f50daa8","tier":"starter_2024"},"version":341,"publish_version":341,"role":null,"authored":false,"authors":[{"type":"individual","id":"0ca9534b318b4d3b","login":"nicktahani","name":"Nicholas Tahani","avatar_url":"https://avatars-next.observableusercontent.com/189bd6428a8cf525288ae395fd50fe4a2bfd4252fba80403361960889f50daa8","tier":null}],"members":[{"type":"individual","id":"0ca9534b318b4d3b","login":"nicktahani","name":"Nicholas Tahani","avatar_url":"https://avatars-next.observableusercontent.com/189bd6428a8cf525288ae395fd50fe4a2bfd4252fba80403361960889f50daa8","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"NYPD Complaints (1985-2020)","cells":[{"id":0,"value":"md`# NYPD Complaints (1985-2020)`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"md`Note: Some complaints (${err_count} to be exact) were erroneously marked under precincts that do not exist (\" \", \"1000\", and \"0\") — they have been filtered out for the time being. \n\nHover over precincts to see a breakdown of complaints filed by ethnicity.\n\n*Data: [ProPublica Civilian Complaints Against New York City Police Officers](https://www.propublica.org/datastore/dataset/civilian-complaints-against-new-york-city-police-officers)*\n\n---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"viewof date = select({\n description: 'Filter Complaints by All or Year',\n options: allYears,\n value: allYears.sort((a, b) => b - a).at(6)\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"md`### Chart Utils`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"proj = d3.geoAlbers()\n .scale(70000)\n .rotate([74.0060, 0])\n .center([0, 40.7128])\n .translate([width/2, height/ 1.5])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"path = d3.geoPath(proj)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"color = d3.scaleSequential([0, d3.max(mappedPrecincts.values())], d3.interpolateYlOrRd)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"formatNames = d => `Precinct ${d}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"formatCounts = d => `${d.toLocaleString()} Complaints`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":37,"value":"height = 500","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"margin = ({top: 20, right: 0, bottom: 30, left: 40})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"totalComplaints = filteredPrecincts.reduce((acc, item) => acc + item.count, 0)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":43,"value":"md`### Data`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":198,"value":"html`Some of these cells are experimental and unused`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"mappedPrecincts = Object.assign(new Map(filteredPrecincts.map(({id, precinct_count: count}) => [id, count]))) ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":49,"value":"complaintsData = {\n const text = await FileAttachment(\"nypd_allegations.csv\").text()\n return d3.csvParse(text, d => ({\n ...d,\n aCount: +d.allegation_count\n }))\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"//filter out precinct ids that don't exist (for now)\nfilteredPrecincts = Object.values(precinctByYear.data[date]).filter(d => (d.id !== '') && (d.id !== '1000') && (d.id !== '0'))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":303,"value":"err_count = precinct_counts\n .filter(d => d.id === '' || d.id === '1000' || d.id === '0')\n .reduce((sum, d) => sum + d.count, 0)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":55,"value":"precinct_counts = d3.csvParse(await FileAttachment(\"counts_by_precinct.csv\").text(), \n d => ({...d, count: +d.precinct_count}))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"precinctByYear = FileAttachment(\"ethnicityByYear.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"decisions = d3.group(rawData, d => d.comp_decision)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"allYears = Object.keys(ethnicities).sort((a, b) => b - a)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"ethnicity_counts = FileAttachment(\"ethnicity_counts.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"ethnicities = FileAttachment(\"ethnicites.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":73,"value":"rawData = {\n const text = await FileAttachment(\"allegations_202007271729.csv\").text()\n return d3.csvParse(text, d => ({\n ...d,\n name: `${d.first_name} ${d.last_name}`,\n comp_decision: d.board_disposition.split(' ')[0],\n year: d.year_received\n }))\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"ny = FileAttachment(\"nypd_precincts.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"md`### Imports`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":82,"value":"import {legend} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"import { select } from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":88,"value":"topojson = require(\"topojson-client@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":91,"value":"d3 = require('d3@5', 'd3-array')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"patternSize = 5","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"patternDefs = html`\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 33:"$32:body"