45:["$","title",null,{"children":"Graph Design - Exercise | Aravind Vaddi | Observable"}] 4d:T5b1,function cuisine(data) { var cuisine = d3.rollup(data, cuisine => cuisine, d => d.cuisine); cuisine = Array.from(cuisine, ([cuisine, numInspections]) => ({cuisine, numInspections})); for (var i = 0; i < cuisine.length; i++) { cuisine[i]["count"] = cuisine[i]["numInspections"].length; } cuisine = cuisine.slice() .sort((a, b) => d3.descending(a.count, b.count)) .slice(0, 5); for (var i = 0; i < cuisine.length; i++) { cuisine[i]["cuisine"] = cuisine[i]["cuisine"].split("(")[0]; } for (var i = 0; i < cuisine.length; i++) { var a = 0, b = 0, c = 0, o = 0; var set = new Set(); for (var j = 0; j < cuisine[i]["count"]; j++) { if(set.has(cuisine[i]["numInspections"][j]["inspectionID"]) === false) { set.add(cuisine[i]["numInspections"][j]["inspectionID"]); if (cuisine[i]["numInspections"][j]["grade"] === "A") { a++; } else if (cuisine[i]["numInspections"][j]["grade"] === "B") { b++; } else if (cuisine[i]["numInspections"][j]["grade"] === "C") { c++; } else if (cuisine[i]["numInspections"][j]["grade"] !== "") { o++; } } } cuisine[i]["Grade A"] = a; cuisine[i]["Grade B"] = b; cuisine[i]["Grade C"] = c; cuisine[i]["Other Grades"] = o; cuisine[i]["uCount"] = set.size; } for (var i = 0; i < cuisine.length; i++) { delete(cuisine[i].numInspections); delete(cuisine[i].count); } return cuisine }4e:T5fd,{ const margin = {top: 10, right: 30, bottom: 20, left: 40}; const visWidth = width - margin.left - margin.right; const visHeight = 500 - margin.top - margin.bottom; const svg = d3.select(DOM.svg(visWidth + margin.left + margin.right, visHeight + margin.top + margin.bottom)); const g = svg.append('g') .attr('transform', `translate(${margin.left}, ${margin.top})`); const x = d3.scaleTime() .domain(d3.extent(dataByBorough[0]["counts"], d => d.month)) .range([0, visWidth]); const y = d3.scaleLinear() .domain([0, maxSingleBoroughInjuries]).nice() .range([visHeight, 0]); const xAxis = d3.axisBottom(x).tickFormat(d3.timeFormat('%B')) const yAxis = d3.axisLeft(y); g.append('g') .attr('transform', `translate(0,${visHeight})`) .call(xAxis); g.append('g') .call(yAxis) .call(g => g.selectAll('.domain').remove()) .append('text') .attr('text-anchor', 'start') .attr('dominant-baseline', 'middle') .attr('fill', 'black') .attr('x', 5) .text('Inspection Count'); const line = d3.line() .x(d => x(d.month)) .y(d => y(d.numInspections)); const series = g.selectAll('.series') .data(dataByBorough) .join('g') .attr('stroke', d => colorBoro(d.borough)) .attr('class', 'series') .append('path') .datum(d => d.counts) .attr('fill', 'none') .attr('stroke-width', 2) .attr('d', line); return svg.node(); }4f:T460,dataByBorough = { const b = data.filter(d => d.boro === "Brooklyn") const m = data.filter(d => d.boro === "Manhattan") const q = data.filter(d => d.boro === "Queens") const s = data.filter(d => d.boro === "Staten Island") const bx = data.filter(d => d.boro === "Bronx") var boro = new Array(b, m, q, s, bx) for (var j = 0; j < boro.length; j++) { boro[j] = d3.rollup(boro[j], inspectionsForMonth => inspectionsForMonth, d => (d.date).getMonth()); boro[j] = Array.from(boro[j], ([month, numInspections]) => ({month, numInspections})); } for (var j = 0; j < boro.length; j++) { for (var month = 0; month < boro[j].length; month++) { boro[j][month]["numInspections"] = d3.rollup(boro[j][month]["numInspections"], v => v, d => d.inspectionID).size } } var r = new Array(); for (var j = 0; j < boro.length; j++) { r[j] = new Object(); r[j]["borough"] = boroughs[j]; r[j]["counts"] = boro[j].slice(); } for (var i = 0; i < r.length; i++) { for (var j = 0; j < 12; j++) { r[i]["counts"][j]["month"] = getDate(j); } } return r; }50:Taf6,{ // margin convention const margin = {top: 30, right: 50, bottom: 50, left: 150}; const visWidth = 700 - margin.left - margin.right; const visHeight = 500 - margin.top - margin.bottom; const svg = d3.select(DOM.svg(visWidth + margin.left + margin.right, visHeight + margin.top + margin.bottom)); const g = svg.append("g") .attr("transform", `translate(${margin.left}, ${margin.top})`); // add title g.append("text") .attr("x", visWidth / 2) .attr("y", -margin.top) .attr("text-anchor", "middle") .attr("dominant-baseline", "hanging") .attr("font-family", "sans-serif") .attr("font-size", "16px") .text("Number of Violations by Violation Code and Cuisine"); // create scales const x = d3.scalePoint() .domain(cuisines) .range([0, visWidth]) .padding(0.5); const y = d3.scalePoint() .domain(violations) .range([0, visHeight]) .padding(0.5); const maxRadius = 10; const radius = d3.scaleSqrt() .domain([0, d3.max(numViolationsByCodesAndCuisines, d => d3.max(d.cuisines, b => b.count))]) .range([0, maxRadius]); // add legend const legend = g.append("g") .attr("transform", `translate(${visWidth + margin.right - 40}, 0)`) .selectAll("g") .data([250, 600, 1200, 2500]) .join("g") .attr("transform", (d, i) => `translate(0, ${i * 2.5 * maxRadius})`); legend.append("circle") .attr("r", d => radius(d)) .attr("fill", "steelblue"); legend.append("text") .attr("font-family", "sans-serif") .attr("font-size", 12) .attr("dominant-baseline", "middle") .attr("x", maxRadius + 5) .text(d => d); // create and add axes const xAxis = d3.axisBottom(x); g.append("g") .attr("transform", `translate(0, ${visHeight})`) .call(xAxis) .call(g => g.selectAll(".domain").remove()) .append("text") .attr("x", visWidth / 2) .attr("y", 40) .attr("fill", "black") .attr("text-anchor", "middle") .text("Cuisines"); const yAxis = d3.axisLeft(y); g.append("g") .call(yAxis) .call(g => g.selectAll(".domain").remove()) .append("text") .attr("x", -65) .attr("y", visHeight / 2) .attr("fill", "black") .attr("dominant-baseline", "middle") .text("Violation Codes"); // draw points const rows = g.selectAll(".row") .data(numViolationsByCodesAndCuisines) .join("g") .attr("transform", d => `translate(0, ${y(d.violationCode)})`); rows.selectAll("circle") .data(d => d.cuisines) .join("circle") .attr("cx", d => x(d.cuisine)) .attr("cy", d => 0) .attr("fill", "steelblue") .attr("r", d => radius(d.count)); return svg.node(); }51:[] 49:{"id":"f24c40e95f142125","slug":"graph-design-exercise","title":"Graph Design - Exercise","thumbnail":"9a135328aaf27bdb6af44b1b20163c3861b367cce86240c6950836cf0e4fd5b5","access_level":"public","create_time":"$D2020-03-03T03:07:48.426Z","update_time":"$D2020-03-07T07:15:23.201Z","view_time":null,"first_public_time":"$D2020-10-24T03:34:50.212Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"0113c1d21118153a","login":"aravindvaddi","name":"Aravind Vaddi","avatar_url":"https://avatars-next.observableusercontent.com/9d7379c7c64312d2e98cead383fb2b0669989824621f58236ec42ee6e7cb56ae","tier":"starter_2024","bio":"Learning","followed_by_you":false,"follows_you":false},"version":598,"publish_version":598,"role":null,"authored":false,"authors":[{"type":"individual","id":"2aa8ff05e4c1a3b8","login":"aravindvaddi","name":"Aravind Vaddi","avatar_url":"https://avatars-next.observableusercontent.com/9d7379c7c64312d2e98cead383fb2b0669989824621f58236ec42ee6e7cb56ae","tier":null,"bio":"Learning","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"2aa8ff05e4c1a3b8","login":"aravindvaddi","name":"Aravind Vaddi","avatar_url":"https://avatars-next.observableusercontent.com/9d7379c7c64312d2e98cead383fb2b0669989824621f58236ec42ee6e7cb56ae","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Graph Design - Exercise","cells":[{"id":0,"value":"md`# Graph Design - Exercise\n\nIn this exercise, we will be working data derived from the [NYC Restaurant Inspection Results dataset](https://data.cityofnewyork.us/Health/DOHMH-New-York-City-Restaurant-Inspection-Results/43nn-pn8j).\n\nFor each problem below, create a visualization using D3 that provides an answer to the questions. Also write a short justification of your visualization design choices.\n\nTo get started, create a fork of this notebook. When you are finished, **do not** publish your notebook. Instead, go to the menu at the top with the three dots and click \"Enable link sharing.\" You can then submit the link on NYU Classes.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"md`## Data\n\nFirst, we'll import D3.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"d3 = require(\"d3@5\", \"d3-array@2\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":50,"value":"md`Next, we'll load the inspection results data.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"inspectionsURL = 'https://gist.githubusercontent.com/DanielKerrigan/886a83eb76068a1caf46ef630a276099/raw/267f9c1a45c1ee8e60cdd40f84f77697b38dfb02/nyc_restaurant_inspections_2019.csv'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":53,"value":"data = d3.csv(inspectionsURL, row => {\n const date = d3.timeParse(\"%Y-%m-%d\")(row[\"INSPECTION DATE\"]);\n \n const d = {\n restaurantID: row[\"CAMIS\"],\n boro: row[\"BORO\"],\n zip: row[\"ZIPCODE\"],\n cuisine: row[\"CUISINE DESCRIPTION\"],\n date: date,\n violationCode: row[\"VIOLATION CODE\"],\n score: +row[\"SCORE\"],\n grade: row[\"GRADE\"],\n inspectionID: row[\"INSPECTION ID\"]\n };\n \n return d;\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":63,"value":"md`\nEach object in this dataset represents a violation citation that was issued during a restaurant inspection. If one inspection found multiple violations, then there is one row per violation. In this case, each row has the same values except for the violaiton code. If two violations have the same inspection ID, then they are from the same inspection. If an inspection found no violations, then there is one object with no violation code.\n\nLastly, we'll load a map from violation code to violation description. You don't have to use this, but you may find it interesting.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":66,"value":"violationCodeURL = \"https://gist.githubusercontent.com/DanielKerrigan/35566990420138bb843b780be049b71c/raw/4cb07f7e6b2f6898f8e00863a98dd36881b4b853/nyc_restaurant_inspections_violation_codes.csv\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"violationCodeToDescription = new Map(await d3.csv(violationCodeURL, row => [row[\"CODE\"], row[\"DESCRIPTION\"]]))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"md`## Problem 1\n\nWhat is the distribution of grades over cuisine descriptions? Which cuisise descriptions have the best/worst distribution?\n\nUse only the top 5 most frequent cuisine descriptions in the dataset. You may also want to consider only showing certain grades, such as A, B, C, or A, B, C, Other.\n\nMake sure you only count one grade per inspection. If one inspection has multiple violations, then each violation object will have the same grade. You only want to count the grade once.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":316,"value":"key = legend({title: \"Grade distribution\", color, tickSize: 0})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":304,"value":"chart = {\n const svg = d3.create(\"svg\")\n .attr(\"viewBox\", [0, 0, width, height])\n .style(\"overflow\", \"visible\");\n\n svg.append(\"g\")\n .selectAll(\"g\")\n .data(series)\n .enter().append(\"g\")\n .attr(\"fill\", d => color(d.key))\n .selectAll(\"rect\")\n .data(d => d)\n .join(\"rect\")\n .attr(\"x\", d => x(d[0]))\n .attr(\"y\", (d, i) => y(d.data.cuisine))\n .attr(\"width\", d => x(d[1]) - x(d[0]))\n .attr(\"height\", y.bandwidth())\n .append(\"title\")\n .text(d => `${d.data.name} ${d.key}\n${formatPercent(d[1] - d[0])} (${formatValue(d.data[d.key])})`);\n\n svg.append(\"g\")\n .call(xAxis);\n\n svg.append(\"g\")\n .call(yAxis);\n\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":429,"value":"md`I'm choosing a stacked bar graph but creating a distribution in terms of the relative value of the grades for each of the top 5 cuisine descriptions because this enables us to see how the grades are distributed and also vertically compare the grades through values.

\nThe graph also shows the exact percentage of each grade upon hovering for the extra curious.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":225,"value":"$4d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":264,"value":"cuisineData = cuisine(data);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":268,"value":"keys = new Array(\"Grade A\", \"Grade B\", \"Grade C\", \"Other Grades\");","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":250,"value":"series = d3.stack()\n .keys(keys)\n .offset(d3.stackOffsetExpand)\n (cuisineData)\n .map(d => (d.forEach(v => v.key = d.key), d))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":282,"value":"margin = ({top: 30, right: 10, bottom: 0, left: 80})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":285,"value":"height = cuisineData.length * 25 + margin.top + margin.bottom","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":287,"value":"formatValue = x => isNaN(x) ? \"N/A\" : x.toLocaleString(\"en\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":289,"value":"formatPercent = d3.format(\".1%\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":293,"value":"y = d3.scaleBand()\n .domain(cuisineData.map(d => d.cuisine))\n .range([margin.top, height - margin.bottom])\n .padding(0.08)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":291,"value":"yAxis = g => g\n .attr(\"transform\", `translate(${margin.left},0)`)\n .call(d3.axisLeft(y).tickSizeOuter(0))\n .call(g => g.selectAll(\".domain\").remove())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":295,"value":"x = d3.scaleLinear()\n .range([margin.left, width - margin.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":297,"value":"xAxis = g => g\n .attr(\"transform\", `translate(0,${margin.top})`)\n .call(d3.axisTop(x).ticks(width / 100, \"%\"))\n .call(g => g.selectAll(\".domain\").remove())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":300,"value":"color = d3.scaleOrdinal()\n .domain(series.map(d => d.key))\n .range(d3.schemeSpectral[series.length])\n .unknown(\"#ccc\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":302,"value":"import {legend} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"md`## Problem 2\n\nHow do the number of inspections change over time for each borough?\n\nUse month as the level of temporal granularity.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":394,"value":"legendBoro()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":381,"value":"$4e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":436,"value":"md`I'm choosing a multi line graph so that we can simultaneously have the number of inspections per borough on the graph. These are color coded so that we may choose to focus our attention on one specific borough.

The x axis is monthly granulated temporal line graph and thus gives us an overview of how the number of inspections per borough change over time.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":383,"value":"maxSingleBoroughInjuries = d3.max(dataByBorough, d => d3.max(d.counts, e => e.numInspections))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":337,"value":"$4f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":371,"value":"function getDate(j) {\n var date = new Date();\n date.setYear(\"2019\");\n date.setMonth(j);\n date.setHours(0);\n date.setMinutes(0);\n date.setSeconds(0);\n date.setDate(1);\n date.setMilliseconds(0);\n \n return date;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":323,"value":"boroughs = Array.from(d3.rollup(data,\n collisions => d3.sum(collisions, c => c.injured),\n d => d.boro),\n ([key, value]) => ({key, value}))\n .sort((a, b) => d3.descending(a.value, b.value))\n .map(d => d.key).slice(0, 5)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":330,"value":"function legendBoro() {\n const size = 10;\n const lineHeight = size * 1.5;\n \n const svg = d3.select(DOM.svg(width, colorBoro.domain().length * lineHeight));\n \n const rows = svg\n .selectAll(\"g\")\n .data(colorBoro.domain())\n .join(\"g\")\n .attr(\"transform\", (d, i) => `translate(0, ${i * lineHeight})`);\n \n rows.append(\"rect\")\n .attr(\"height\", size)\n .attr(\"width\", size)\n .attr(\"fill\", d => colorBoro(d));\n \n rows.append(\"text\")\n .attr(\"font-family\", \"sans-serif\")\n .attr(\"font-size\", 12)\n .attr(\"dominant-baseline\", \"hanging\")\n .attr(\"x\", lineHeight)\n .text(d => d);\n \n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":334,"value":"colorBoro = d3.scaleOrdinal()\n .domain(boroughs)\n .range(d3.schemeTableau10);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"md`## Problem 3\n\nIs there a relationship between cuisine type and violation? Do some cuisine types have uique violations that differ from the others?\n\nAgain, use only the top 5 most frequent cuisine descriptions in the dataset. You can filter the violations as you see fit.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":527,"value":"$50","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":543,"value":"md`For this, I've chosen a matrix with the top five cuisines and then the top twenty violation codes based on frequence so we are able to see how violation codes and cuisines interact.

We can see that some codes are prevalent to a specific kind of cuisine or in other cases absent in one specific cuisine. For example, 02B and 04M are visibly more prevalent in every type of cuisine except Cafe/Coffee/Tea`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":485,"value":"numViolationsByCodesAndCuisines = {\n const violationsToCuisinesCount = d3.rollup(nData.filter(d => d.violationCode !== \"\"),\n requests => requests.length,\n d => d.violationCode, d => d.cuisine);\n \n return Array.from(violationsToCuisinesCount, ([violation, cuisineToCount]) => ({\n violationCode: violation,\n cuisines: Array.from(cuisineToCount, ([cuisine, count]) => ({cuisine, count}))\n }));\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":587,"value":"nData = newerData(tData)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":591,"value":"function newerData(data) {\n var result = new Array();\n \n for (var i = 0; i < data.length; i++) {\n if (violations.includes(data[i].violationCode)) {\n result.push(data[i]);\n }\n }\n \n return result;\n}\n ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":551,"value":"violations = getViolations(tData).slice(0, 20)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":506,"value":"tData = newData(data, cuisines)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":503,"value":"function newData(data, cuisines) {\n var result = new Array();\n \n for (var i = 0; i < data.length; i++) {\n if (cuisines.includes(data[i].cuisine.split(\" \")[0])) {\n data[i].cuisine = data[i].cuisine.split(\" \")[0];\n result.push(data[i]);\n }\n }\n \n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":456,"value":"cuisines = getCuisines(data).map(d => d.cuisine.split(\" \")[0]);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":452,"value":"function getCuisines(data) {\n var cuisine = d3.rollup(data, cuisine => cuisine, d => d.cuisine);\n cuisine = Array.from(cuisine, ([cuisine, numInspections]) => ({cuisine, numInspections}));\n \n for (var i = 0; i < cuisine.length; i++) {\n cuisine[i][\"count\"] = cuisine[i][\"numInspections\"].length;\n }\n \n cuisine = cuisine.slice()\n .sort((a, b) => d3.descending(a.count, b.count)).slice(0, 5)\n \n \n \n return cuisine;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":464,"value":"function getViolations(data) {\n const newData = data.filter(d => d.violationCode !== \"\")\n const violationCodes = Array.from(d3.rollup(newData, v => v, d => d.violationCode),\n ([violation, count]) => ({violation, count}));\n \n return violationCodes.sort((a, b) => d3.descending(a.count, b.count))\n .map(d => d.violation);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W51","stdlib":"1"}} 44:null